我认为他们可以,但我没有把我的钱放在我的嘴(这么说)设置只读属性实际上似乎没有做任何事情。
我宁愿不使用Disabled,因为我希望选中的复选框与表单的其余部分一起提交,我只是不希望客户端能够在某些情况下更改它们。
我认为他们可以,但我没有把我的钱放在我的嘴(这么说)设置只读属性实际上似乎没有做任何事情。
我宁愿不使用Disabled,因为我希望选中的复选框与表单的其余部分一起提交,我只是不希望客户端能够在某些情况下更改它们。
当前回答
基于以上答案,如果使用jQuery,这可能是所有输入的一个很好的解决方案:
<script>
$(function () {
$('.readonly input').attr('readonly', 'readonly');
$('.readonly textarea').attr('readonly', 'readonly');
$('.readonly input:checkbox').click(function(){return false;});
$('.readonly input:checkbox').keydown(function () { return false; });
});
</script>
我对Asp使用这个。Net MVC设置一些表单元素为只读。通过将任何父容器设置为.readonly,上述方法适用于文本和复选框,例如以下场景:
<div class="editor-field readonly">
<input id="Date" name="Date" type="datetime" value="11/29/2012 4:01:06 PM" />
</div>
<fieldset class="flags-editor readonly">
<input checked="checked" class="flags-editor" id="Flag1" name="Flags" type="checkbox" value="Flag1" />
</fieldset>
其他回答
基于以上答案,如果使用jQuery,这可能是所有输入的一个很好的解决方案:
<script>
$(function () {
$('.readonly input').attr('readonly', 'readonly');
$('.readonly textarea').attr('readonly', 'readonly');
$('.readonly input:checkbox').click(function(){return false;});
$('.readonly input:checkbox').keydown(function () { return false; });
});
</script>
我对Asp使用这个。Net MVC设置一些表单元素为只读。通过将任何父容器设置为.readonly,上述方法适用于文本和复选框,例如以下场景:
<div class="editor-field readonly">
<input id="Date" name="Date" type="datetime" value="11/29/2012 4:01:06 PM" />
</div>
<fieldset class="flags-editor readonly">
<input checked="checked" class="flags-editor" id="Flag1" name="Flags" type="checkbox" value="Flag1" />
</fieldset>
这适用于我的Chrome浏览器:
<input type="checkbox" onclick="return false">
摘自https://stackoverflow.com/a/71086058/18183749
如果你不能使用'disabled'属性(因为它会擦除值的 input at POST),并注意到html属性'readonly'只工作 在文本区域和一些输入(文本,密码,搜索,据我所见), 最后,如果你不想重复你所有的 您可能会发现,带有隐藏输入逻辑的选择、复选框和单选 下面的函数或任何他的内部逻辑你喜欢:
addReadOnlyToFormElements = function (idElement) {
// html readonly don't work on input of type checkbox and radio, neither on select. So, a safe trick is to disable the non-selected items
$('#' + idElement + ' input[type="checkbox"]:not(:checked)').prop('disabled',true);
// and, on the selected ones, to disable mouse/keyoard events and mimic readOnly appearance
$('#' + idElement + ' input[type="checkbox"]:checked').prop('tabindex','-1').css('pointer-events','none').css('opacity','0.5');
}
没有什么比删除这些只读更容易的了
removeReadOnlyFromFormElements = function (idElement) {
// Remove the disabled attribut on non-selected
$('#' + idElement + ' input[type="checkbox"]:not(:checked)').prop('disabled',false);
// Restore mouse/keyboard events and remove readOnly appearance on selected ones
$('#' + idElement + ' input[type="checkbox"]:checked').prop('tabindex','').css('pointer-events','').css('opacity','');
}
<input type="radio" name="alwaysOn" onchange="this.checked=true" checked="checked">
<input type="radio" name="alwaysOff" onchange="this.checked=false" >
READONLY对复选框不起作用,因为它阻止你编辑字段的值,但有了复选框,你实际上是在编辑字段的状态(在||关闭)
从faqs.org:
READONLY只是阻止用户更改字段的值,而不是阻止用户与字段交互,理解这一点很重要。例如,在复选框中,您可以打开或关闭复选框(从而设置CHECKED状态),但不能更改字段的值。
如果不想使用disabled,但仍然想提交值,那么当值不满足编辑条件时,将值作为隐藏字段提交并将其内容打印给用户如何?如。
// user allowed change
if($user_allowed_edit)
{
echo '<input type="checkbox" name="my_check"> Check value';
}
else
{
// Not allowed change - submit value..
echo '<input type="hidden" name="my_check" value="1" />';
// .. and show user the value being submitted
echo '<input type="checkbox" disabled readonly> Check value';
}