HTML 复选框的选中属性的正确值是多少？

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">

答案是不重要吗？我在此处没有看到标记为正确的答案的证据< /a> 来自 规范 本身：

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

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

Answer 1

严格来说，您应该根据规范此处放置一些有意义的内容< /a>，最正确的版本是：

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

对于 HTML，您还可以使用 空属性语法，checked=""，甚至简单的checked（对于更严格的XHTML，这是不支持）。

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

<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：

禁用的内容属性是一个布尔属性。

http://www.w3.org/TR/html5/infrastruct.html #布尔属性：

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

如果该属性存在，则其值必须是空字符串或与该属性的规范名称匹配的 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"，因为 是无效的 XHTML（但有效的 HTML），其他替代方案是可读性较差。否则，只需使用 因为它更短。

Answer 3

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

这些同样有效。在 JavaScript 中：

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

Answer 4

你想要这个我想：
已检查='已检查'

Answer 5

1. 检查
2. 检查=“”

3. 检查=“检查”

   是等价的；

---

根据规范 复选框
'----ⓘchecked=“checked”或“”（空字符串）或空
指定该元素代表选定的控件。---'

Answer 6

这是一个非常疯狂的小镇，使检查为假的唯一方法是省略任何值。使用 Angular 1.x，你可以这样做：

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

如果你需要不检查它，这会更明智。

Answer 7

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

这与无线电输入完全相同。

但是..我有一种感觉，这不是你所要求的...所以只要把我写的另一个答案写在下面：

如果 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 8

我认为这可能有帮助：

---

First read all the specs from Microsoft and W3.org.
You'd see that the setting the actual element of a checkbox needs to be done on the ELEMENT PROPERTY, not the UI or attribute.
$('mycheckbox')[0].checked

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

if($('mycheckbox')[0].checked === "true"){
//做某事
}

您还需要意识到“checked”ATTRIBUTE 用于最初设置复选框的值。一旦元素渲染到 DOM 中，这并没有多大作用。想象一下当网页加载并最初解析时此工作原理。
我将按照 IE 的偏好进行选择：

最后，复选框的主要混乱之处在于复选框 UI 元素与元素的属性值不同。它们不直接相关。
如果您使用 .net，您会发现用户“选中”复选框永远不会反映传递给控制器​​的实际 bool 值。
为了设置 UI，我使用 $('mycheckbox').val(true); 和 $('mycheckbox').attr('checked', 'checked');< /代码>

---

In short, for a checked checkbox you need:
Initial DOM: <input type="checkbox" checked="checked">
Element Property: $('mycheckbox')[0].checked = "true";
UI: $('mycheckbox').val(true); and $('mycheckbox').attr('checked', 'checked');

Answer 9

已选中的复选框在技术上的正确值为零 (0)，并且当未选中该复选框时，未定义其索引。

Answer 10

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