我认为他们可以,但我没有把我的钱放在我的嘴(这么说)设置只读属性实际上似乎没有做任何事情。
我宁愿不使用Disabled,因为我希望选中的复选框与表单的其余部分一起提交,我只是不希望客户端能够在某些情况下更改它们。
我认为他们可以,但我没有把我的钱放在我的嘴(这么说)设置只读属性实际上似乎没有做任何事情。
我宁愿不使用Disabled,因为我希望选中的复选框与表单的其余部分一起提交,我只是不希望客户端能够在某些情况下更改它们。
当前回答
这就出现了一些可用性问题。
如果您想要显示一个复选框,但不让它与之交互,那么为什么还要使用复选框呢?
然而,我的方法是使用disabled(用户希望禁用的复选框不可编辑,而不是使用JS使启用的复选框无法工作),并使用javascript添加一个表单提交处理程序,在表单提交之前启用复选框。这样你就能把你的价值观公布出来。
是这样的:
var form = document.getElementById('yourform');
form.onSubmit = function ()
{
var formElems = document.getElementsByTagName('INPUT');
for (var i = 0; i , formElems.length; i++)
{
if (formElems[i].type == 'checkbox')
{
formElems[i].disabled = false;
}
}
}
其他回答
目前的大多数答案都有以下一个或多个问题:
只检查鼠标而不是键盘。 只检查页面加载。 挂钩总是流行的变更或提交事件,如果有其他东西挂钩它们,它们就不会总是有效。 需要一个隐藏的输入或其他特殊的元素/属性,你必须撤销,以便重新启用复选框使用javascript。
下面的方法很简单,没有这些问题。
$('input[type="checkbox"]').on('click keyup keypress keydown', function (event) {
if($(this).is('[readonly]')) { return false; }
});
如果复选框是只读的,它不会改变。如果不是,也会是。它确实使用了jquery,但你可能已经在使用它了…
它的工作原理。
基于以上答案,如果使用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>
当将一个HTML复选框发布到服务器时,它有一个字符串值'on'或''。
Readonly不会停止用户编辑复选框,disabled会停止返回的值。 解决这个问题的一种方法是使用一个隐藏元素来存储实际值,而显示的复选框是一个禁用的dummy。通过这种方式,复选框状态在帖子之间被持久化。
这是一个函数。它使用'T'或'F'的字符串,你可以以任何你喜欢的方式更改它。这是在一个ASP页面中使用的使用服务器端的VB脚本。
public function MakeDummyReadonlyCheckbox(i_strName, i_strChecked_TorF)
dim strThisCheckedValue
if (i_strChecked_TorF = "T") then
strThisCheckedValue = " checked "
i_strChecked_TorF = "on"
else
strThisCheckedValue = ""
i_strChecked_TorF = ""
end if
MakeDummyReadonlyCheckbox = "<input type='hidden' id='" & i_strName & "' name='" & i_strName & "' " & _
"value='" & i_strChecked_TorF & "'>" & _
"<input type='checkbox' disabled id='" & i_strName & "Dummy' name='" & i_strName & "Dummy' " & _
strThisCheckedValue & ">"
end function
public function GetCheckbox(i_objCheckbox)
select case trim(i_objCheckbox)
case ""
GetCheckbox = "F"
case else
GetCheckbox = "T"
end select
end function
在ASP页面的顶部,你可以提取持久值…
strDataValue = GetCheckbox(Request.Form("chkTest"))
当你想输出你的复选框时,你可以这样做…
response.write MakeDummyReadonlyCheckbox("chkTest", strDataValue)
我已经测试过了,它工作得很好。它也不依赖于JavaScript。
我会对ConroyP的回答进行评论,但这需要50个声望,而我没有。我确实有足够的声誉来发布另一个答案。对不起。
The problem with ConroyP's answer is that the checkbox is rendered unchangeable by not even including it on the page. Although Electrons_Ahoy does not stipulate as much, the best answer would be one in which the unchangeable checkbox would look similar, if not the same as, the changeable checkbox, as is the case when the "disabled" attribute is applied. A solution which addresses the two reasons Electrons_Ahoy gives for not wanting to use the "disabled" attribute would not necessarily be invalid because it utilized the "disabled" attribute.
假设有两个布尔变量$checked和$disabled:
if ($checked && $disabled)
echo '<input type="hidden" name="my_name" value="1" />';
echo '<input type="checkbox" name="my_name" value="1" ',
$checked ? 'checked="checked" ' : '',
$disabled ? 'disabled="disabled" ' : '', '/>';
如果$checked为true,则复选框显示为选中。如果$checked为false,则该复选框显示为未选中。当且仅当$disabled为false时,用户可以更改复选框的状态。当复选框未选中时,不管用户是否选中,“my_name”参数都不会发布。“my_name=1”参数在复选框被选中时被发布,无论用户是否选中。我相信这就是Electrons_Ahoy一直在寻找的。
如果你想要你所有的复选框都是“锁定”的,这样用户就不能改变“checked”状态,如果“readonly”属性是存在的,那么你可以使用jQuery:
$(':checkbox').click(function () {
if (typeof ($(this).attr('readonly')) != "undefined") {
return false;
}
});
这段代码很酷的一点是,它允许您在整个代码中更改“readonly”属性,而不必重新绑定每个复选框。
它也适用于单选按钮。