我有两页HTML表单。第一页有一个提交表单,第二页有一个确认表单。第一个表单提供了许多控件的选择,而第二个页面再次显示来自提交表单的数据,并显示确认消息。在第二种形式中,所有字段必须是静态的。
从我所看到的,一些表单控件可以是只读的,所有控件都可以被禁用,区别在于你仍然可以选择一个只读字段。
而不是按字段做这个是否有任何方法标记整个表单为只读/禁用/静态,这样用户就不能改变任何控件?
我有两页HTML表单。第一页有一个提交表单,第二页有一个确认表单。第一个表单提供了许多控件的选择,而第二个页面再次显示来自提交表单的数据,并显示确认消息。在第二种形式中,所有字段必须是静态的。
从我所看到的,一些表单控件可以是只读的,所有控件都可以被禁用,区别在于你仍然可以选择一个只读字段。
而不是按字段做这个是否有任何方法标记整个表单为只读/禁用/静态,这样用户就不能改变任何控件?
当前回答
简单的方法
$('#yourform .YOUR_CLASS_FOR_INPUTS').prop('readonly', true);
其他回答
你在表单上添加html隐形层。例如
<div class="coverContainer">
<form></form>
</div>
和风格:
.coverContainer{
width: 100%;
height: 100%;
z-index: 100;
background: rgba(0,0,0,0);
position: absolute;
}
当然用户可以在浏览器中隐藏这一层。
<form inert>
这不会改变表单的样式,但会阻止所有输入的可聚焦性和任何按钮的可点击性。
要在angular中有条件地禁用整个fieldset,你可以这样做:
<fieldset [attr.disabled]="isEditable ? null : 'disabled'">
将所有表单id编号,并在JS中运行for循环。
for(id = 0; id<NUM_ELEMENTS; id++)
document.getElementById(id).disabled = false;
你可以使用这个函数禁用表单:
function disableForm(formID){
$('#' + formID).children(':input').attr('disabled', 'disabled');
}
点击这里查看工作演示
注意,它使用jQuery。