HTML 复选框可以设置为只读吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/155291/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can HTML checkboxes be set to readonly?
提问by Electrons_Ahoy
I thought they could be, but as I'm not putting my money where my mouth was (so to speak) setting the readonly attribute doesn't actually seem to do anything.
我认为它们可能是，但由于我没有把钱放在嘴边（可以这么说），因此设置 readonly 属性实际上似乎没有任何作用。
I'd rather not use Disabled, since I want the checked check boxes to be submitted with the rest of the form, I just don't want the client to be able to change them under certain circumstances.
我宁愿不使用禁用，因为我希望选中的复选框与表单的其余部分一起提交，我只是不希望客户端能够在某些情况下更改它们。
回答by Yanni
you can use this:
你可以使用这个：
<input type="checkbox" onclick="return false;"/>
This works because returning false from the click event stops the chain of execution continuing.
这是有效的，因为从 click 事件返回 false 会停止执行链的继续。
回答by ConroyP
READONLYdoesn't work on checkboxes as it prevents you from editing a field's value, but with a checkbox you're actually editing the field's state(on || off)
READONLY不适用于复选框，因为它会阻止您编辑字段的值，但是使用复选框您实际上是在编辑字段的状态（打开 || 关闭）
From faqs.org:
来自faqs.org：
It's important to understand that READONLY merely prevents the user from changing the value of the field, not from interacting with the field. In checkboxes, for example, you can check them on or off (thus setting the CHECKED state) but you don't change the value of the field.
重要的是要理解 READONLY 仅阻止用户更改字段的值，而不是阻止与字段交互。例如，在复选框中，您可以打开或关闭它们（从而设置 CHECKED 状态），但您不会更改该字段的值。
If you don't want to use disabledbut still want to submit the value, how about submitting the value as a hidden field and just printing its contents to the user when they don't meet the edit criteria? e.g.
如果您不想使用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';
}
回答by powtac
This is a checkbox you can't change:
这是一个您无法更改的复选框：
<input type="checkbox" disabled="disabled" checked="checked">
Just add disabled="disabled"as an attribute.
只需添加disabled="disabled"为属性。
Edit to address the comments:
编辑以解决评论：
If you want the data to be posted back, than a simple solutions is to apply the same name to a hidden input:
如果您希望数据被回传，那么一个简单的解决方案是将相同的名称应用于隐藏的输入：
<input name="myvalue" type="checkbox" disabled="disabled" checked="checked"/>
<input name="myvalue" type="hidden" value="true"/>
This way, when the checkbox is set to 'disabled', it only serves the purpose of a visual representation of the data, instead of actually being 'linked' to the data. In the post back, the value of the hidden input is being sent when the checkbox is disabled.
这样，当复选框设置为“禁用”时，它仅用于数据的可视化表示，而不是实际“链接”到数据。在回发中，禁用复选框时将发送隐藏输入的值。
回答by Grant Wagner
<input type="checkbox" onclick="this.checked=!this.checked;">
But you absolutely MUST validate the data on the server to ensure it hasn't been changed.
但是您绝对必须验证服务器上的数据以确保它没有被更改。
回答by summsel
another "simple solution":
另一个“简单的解决方案”：
<!-- 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" />
disabled="disabled" / disabled=true
禁用=“禁用”/禁用=真
回答by FlySwat
This presents a bit of a usability issue.
这提出了一些可用性问题。
If you want to display a checkbox, but not let it be interacted with, why even a checkbox then?
如果你想显示一个复选框，但又不想让它与之交互，那为什么还要一个复选框呢？
However, my approach would be to use disabled (The user expects a disabled checkbox to not be editable, instead of using JS to make an enabled one not work), and add a form submit handler using javascript that enables checkboxes right before the form is submitted. This way you you do get your values posted.
但是，我的方法是使用禁用（用户希望禁用的复选框不可编辑，而不是使用 JS 使启用的复选框不起作用），并使用 javascript 添加表单提交处理程序，在表单之前启用复选框提交。这样你就可以发布你的价值观。
ie something like this:
即这样的事情：
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;
}
}
}
回答by Jan
<input type="checkbox" readonly="readonly" name="..." />
with jquery:
使用 jquery：
$(':checkbox[readonly]').click(function(){
return false;
});
it still might be a good idea to give some visual hint (css, text,...), that the control won't accept inputs.
给出一些视觉提示（css、文本等）仍然可能是一个好主意，控件将不接受输入。
回答by Osama Javed
I used this to achieve the results:
我用它来实现结果：
<input type=checkbox onclick="return false;" onkeydown="return false;" />
回答by Gotham's Reckoning
I happened to notice the solution given below. In found it my research for the same issue. I don't who had posted it but it wasn't made by me. It uses jQuery:
我碰巧注意到下面给出的解决方案。在发现它是我对同一问题的研究。我不知道是谁发布的，但它不是我制作的。它使用jQuery：
$(document).ready(function() {
$(":checkbox").bind("click", false);
});
This would make the checkboxes read only which would be helpful for showing readonly data to the client.
这将使复选框只读，这将有助于向客户端显示只读数据。
回答by Sandman
onclick="javascript: return false;"
