什么'是一个HTML复选框的检查属性的正确值?

我们都知道如何在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">

答案是不重要吗?我没有从规范本身看到标记为正确的在这里的答案的证据:

复选框(和单选按钮)是可以切换的开/关开关 由用户决定。当控制元件被检查时,开关是“打开”的 属性已设置。当提交表单时,只有“on”复选框 控制可以成功。一个表单中的几个复选框可以共享 相同的控件名。因此,例如,复选框允许用户 为相同的属性选择几个值。使用INPUT元素 使用实例创建一个复选框控件

说明书作者会说什么是正确答案?请提供基于证据的答案。

604780 次浏览

你想要这个我认为: checked='checked' < / p >

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

它们是同样有效的。在JavaScript中:

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

好吧,使用它我不认为重要(类似于disabled和readonly),我个人使用checked="checked",但如果你试图用JavaScript操纵它们,你使用true/false

严格来说,你应该放一些有意义的东西——根据规范在这里,最正确的版本是:

<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"上类似的问题。

  1. 检查
  2. 检查= " "
  3. 检查< p > = "检查"

    是等价的;< / p >


根据spec 复选框 '---- checked = "checked"或""(空字符串)或空 ——'

.

HTML5规范:

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

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

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

属性的缺失是唯一有效的语法:

<input />

建议

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

让checked为false的唯一方法是省略任何值,这很疯狂。在Angular 1中。X,你可以这样做:

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

如果你想让它不受控制的话,那就理智多了。

我认为这可能有帮助:


首先阅读来自微软和W3.org的所有规格 你会看到设置一个复选框的实际元素需要在element PROPERTY上完成,而不是在UI或属性上 $('mycheckbox')[0].checked < / p > 其次,你需要意识到checked属性返回一个字符串“true”,“false”
为什么这很重要?因为你需要使用正确的类型。字符串,不是布尔值。这在解析复选框时也很重要 $('mycheckbox')[0].checked = "true"

<代码> if($(“mycheckbox”)[0]。选中=== "true"){ / /做某事 代码}< / > < / p > 你还需要意识到“checked”ATTRIBUTE是用于设置复选框的初始值。一旦元素被呈现给DOM,这就没有什么作用了。当网页加载并最初被解析时,想象一下这样的工作 我将使用IE的首选项:<input type="checkbox" checked="checked"/>

最后,对于复选框混淆的主要方面是复选框的UI元素与元素的属性值不相同。它们之间没有直接关联。 如果你在。net中工作,你会发现用户“勾选”一个复选框永远不会反映传递给控制器的实际bool值。 为了设置UI,我使用了$('mycheckbox').val(true);$('mycheckbox').attr('checked', 'checked');

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

就像所有的输入一样,这个也有一个'value'属性。如果你同时设置了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=

. If为空

这与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的地方。

已选中复选框的技术正确值为零(0),如果未选中复选框,则未定义它的索引。