我认为他们可以,但我没有把我的钱放在我的嘴(这么说)设置只读属性实际上似乎没有做任何事情。
我宁愿不使用Disabled,因为我希望选中的复选框与表单的其余部分一起提交,我只是不希望客户端能够在某些情况下更改它们。
我认为他们可以,但我没有把我的钱放在我的嘴(这么说)设置只读属性实际上似乎没有做任何事情。
我宁愿不使用Disabled,因为我希望选中的复选框与表单的其余部分一起提交,我只是不希望客户端能够在某些情况下更改它们。
当前回答
如果你想让它们以表单的形式提交给服务器,但对用户来说不是交互式的,你可以在css中使用pointer-events: none(适用于所有现代浏览器,除了IE10-和Opera 12-),并将tab-index设置为-1以防止通过键盘更改。还要注意,你不能使用标签标签,因为点击它会改变状态。
input[type="checkbox"][readonly] { pointer-events: none !important; } td { min-width: 5em; text-align: center; } td:last-child { text-align: left; } <table> <tr> <th>usual <th>readonly <th>disabled </tr><tr> <td><input type=checkbox /> <td><input type=checkbox readonly tabindex=-1 /> <td><input type=checkbox disabled /> <td>works </tr><tr> <td><input type=checkbox checked /> <td><input type=checkbox readonly checked tabindex=-1 /> <td><input type=checkbox disabled checked /> <td>also works </tr><tr> <td><label><input type=checkbox checked /></label> <td><label><input type=checkbox readonly checked tabindex=-1 /></label> <td><label><input type=checkbox disabled checked /></label> <td>broken - don't use label tag </tr> </table>
其他回答
onclick="javascript: return false;"
这里的一些答案似乎有点迂回,但这里有一个小技巧。
<form id="aform" name="aform" method="POST">
<input name="chkBox_1" type="checkbox" checked value="1" disabled="disabled" />
<input id="submitBttn" type="button" value="Submit" onClick='return submitPage();'>
</form>
然后在jquery中,你可以选择以下两个选项之一:
$(document).ready(function(){
//first option, you don't need the disabled attribute, this will prevent
//the user from changing the checkbox values
$("input[name^='chkBox_1']").click(function(e){
e.preventDefault();
});
//second option, keep the disabled attribute, and disable it upon submit
$("#submitBttn").click(function(){
$("input[name^='chkBox_1']").attr("disabled",false);
$("#aform").submit();
});
});
演示: http://jsfiddle.net/5WFYt/
另一个“简单的解决方案”:
<!-- field that holds the data -->
<input type="hidden" name="my_name" value="1" />
<!-- visual dummy for the user -->
<input type="checkbox" name="my_name_visual_dummy" value="1" checked="checked" disabled="disabled" />
禁用=“禁用” / 禁用=真
在旧的HTML中可以使用
<input type="checkbox" disabled checked>text
但实际上不建议只使用旧的HTML,现在你应该使用XHTML。
在格式良好的XHTML中必须使用
<input type="checkbox" disabled="disabled" checked="checked" />text <!-- if yu have a checked box-->
<input type="checkbox" disabled="disabled" />text <!-- if you have a unchecked box -->
格式良好的XHTML需要XML表单,这就是使用disabled="disabled"而不是简单地使用disabled的原因。
目前的大多数答案都有以下一个或多个问题:
只检查鼠标而不是键盘。 只检查页面加载。 挂钩总是流行的变更或提交事件,如果有其他东西挂钩它们,它们就不会总是有效。 需要一个隐藏的输入或其他特殊的元素/属性,你必须撤销,以便重新启用复选框使用javascript。
下面的方法很简单,没有这些问题。
$('input[type="checkbox"]').on('click keyup keypress keydown', function (event) {
if($(this).is('[readonly]')) { return false; }
});
如果复选框是只读的,它不会改变。如果不是,也会是。它确实使用了jquery,但你可能已经在使用它了…
它的工作原理。