Question

我们都知道如何在HTML中形成一个复选框输入：

<input name="checkbox_name" id="checkbox_id" type="checkbox">

我不知道 - 复选复选框的技术正确值是什么？我看到这些都有效：

<input name="checkbox_name" id="checkbox_id" type="checkbox" checked>
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="on">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="yes">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="checked">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="true">

答案是无关紧要的吗？我没有看到here本身标记为正确spec的答案的证据：

复选框（和单选按钮）是可以切换的开/关开关由用户。检查控制元件时，开关处于“打开”状态属性已设置。提交表单时，只有“打开”复选框控制可以成功。表单中的几个复选框可以共享相同的控件名称。因此，例如，复选框允许用户为同一属性选择多个值。使用INPUT元素创建一个复选框控件。

规范作者会说什么是正确答案？请提供基于证据的答案。

Answer 1

严格地说，你应该把一些有意义的东西 - 根据规范here，最正确的版本是：

<input name=name id=id type=checkbox checked=checked>

对于HTML，您还可以使用empty attribute syntax，checked=""，甚至只使用checked（对于更严格的XHTML，这是not supported）。

然而，实际上，大多数浏览器几乎都支持引号之间的任何值。将检查以下所有内容：

<input name=name id=id type=checkbox checked>
<input name=name id=id type=checkbox checked="">
<input name=name id=id type=checkbox checked="yes">
<input name=name id=id type=checkbox checked="blue">
<input name=name id=id type=checkbox checked="false">

只有以下内容未经检查：

<input name=name id=id type=checkbox>

另请参阅disabled="disabled"上的类似问题。

Answer 2

HTML5规范：

http://www.w3.org/TR/html5/forms.html#attr-input-checked：

disabled content属性是布尔属性。

http://www.w3.org/TR/html5/infrastructure.html#boolean-attributes：

元素上存在布尔属性表示真值，缺少属性表示假值。

如果该属性存在，则其值必须是空字符串或者是属性规范名称的ASCII不区分大小写匹配的值，没有前导空格或尾随空格。

<强>结论：

以下是有效，等效和真实：

<input type="checkbox" checked />
<input type="checkbox" checked="" />
<input type="checkbox" checked="checked" />
<input type="checkbox" checked="ChEcKeD" />

以下是无效：

<input type="checkbox" checked="0" />
<input type="checkbox" checked="1" />
<input type="checkbox" checked="false" />
<input type="checkbox" checked="true" />

缺少属性是 false 的唯一有效语法：

<input />

<强>建议

如果您关心编写有效的XHTML，请使用checked="checked"，因为<input checked>是无效的XHTML（但是有效的HTML），而其他替代方案的可读性较差。否则，只需使用<input checked>，因为它更短。

Answer 3

<input ... checked />
<input ... checked="checked" />

这些同样有效。在JavaScript中：

input.checked = true;
input.setAttribute("checked");
input.setAttribute("checked","checked");

Answer 4

你想要这个我认为： checked='checked'

Answer 5

已检查
检查=＆＃34;＆＃34;
检查=＆＃34;检查＆＃34;

是等效的;

根据规范checkbox ＆＃39; ----ⓘ检查=＆＃34;检查＆＃34;或＆＃34;＆＃34; （空字符串）或空指定元素表示选定的控件.---＆＃39;

Answer 6

这是一个非常疯狂的小镇，唯一的方法就是忽略任何值。使用Angular 1.x，您可以这样做：

  <input type="radio" ng-checked="false">

如果你需要不加以控制，那就更加明智了。

Answer 7

我认为这可能会有所帮助：

首先阅读Microsoft和W3.org的所有规范。
您会看到，需要在ELEMENT PROPERTY而不是UI或属性上完成复选框实际元素的设置。
$('mycheckbox')[0].checked

其次，您需要知道被检查的属性返回一个字符串“ true”，“ false”
为什么如此重要？因为您需要使用正确的Type。的字符串，而不是一个布尔值。这在解析复选框时也很重要。
$('mycheckbox')[0].checked = "true"

if($('mycheckbox')[0].checked === "true"){ //do something }

您还需要认识到的是，“选中”属性是用于初始设定的复选框的值。一旦将元素呈现到DOM，这并不会做很多事情。想象一下在加载网页并进行初始解析时如何工作。
我将在这一点上继续使用IE的偏好：<input type="checkbox" checked="checked"/>

最后，对复选框的困惑的主要方面是，复选框UI元素与元素的属性值不同。它们不直接相关。如果您在使用.NET，你会发现，用户“检查”复选框从来没有反映传递给控制器的实际bool值。要设置用户界面，我同时使用了$('mycheckbox').val(true);和$('mycheckbox').attr('checked', 'checked');

简而言之，对于选中的复选框，您需要：
初始DOM：<input type="checkbox" checked="checked">
元素属性：$('mycheckbox')[0].checked = "true";
UI：$('mycheckbox').val(true);和$('mycheckbox').attr('checked', 'checked');

Answer 8

就像所有输入一样，这个输入也有一个“值”属性。如果您将 value 属性与 name 属性一起设置，它将在标头中发送 ${name}=${value}。假设我们有一个包含一堆东西的表单，我们希望用户决定他们拥有什么角色，我们可以使用复选框。最简单的方法是设置将传递给服务器的“值”属性。像这样：

<form action="/server" method="post">
    <label>Are you a person?</label>
    <input type="checkbox" name="my_checkbox" value="is_person">
</form>

服务器将收到以下信息： my_checkbox=is_person 但前提是选中了复选框。这将是 my_checkbox= 如果它是空的。

这与 radio 输入完全相同。

但是..我感觉这不是你要的......所以我会在下面写另一个答案：

如果 checked 属性设置为任何内容（即使是 false），它都会被激活，无论如何。 checked 属性没有指定值，如果将其设置为任何值，它将默认为“true”（即使您将其设置为 false）。

例如：

<form action="/server" method="post">
    <label>Are you a person?</label>
    <input type="checkbox" checked="false"> <!--Still checked-->
</form>

即使设置为 false 也会被检查。

<form action="/server" method="post">
    <label>Are you a person?</label>
    <input type="checkbox" checked="asjdiasjiasdjoasi"> <!--Still checked-->
</form>

这样做也会检查它。没关系——只要设置了它就会被检查。

希望这能回答您的问题，checked 属性将检查输入，无论该属性的值如何。

您可以在这里测试：https://battledash-2.github.io/Live-IDE/ 或任何类似 repl.it 的地方，或本地。

Answer 9

选中复选框的技术上正确的值为零 (0)，当复选框未选中时，它的索引未定义。

Answer 10

好吧，使用它我认为不重要（类似于禁用和只读），我个人使用checked =“checked”但如果你试图用JavaScript操纵它们，你使用true / false

HTML复选框的checked属性的正确值是什么？

10 个答案: