disabled 属性的正确值是多少？

Question

文本框或文本区域的disabled属性的正确值是多少？

我以前见过以下使用过：

<input type="text" disabled />
<input type="text" disabled="disabled" />
<input type="text" disabled="true" />

Answer 1

• 对于 XHTML， <input type="text" disabled="disabled" />是有效的标记。
• 对于 HTML5， <input type="text" disabled />是有效的，W3C 在其示例中使用。
• 事实上，这两种方式都适用于所有主要浏览器。

Answer 2

HTML5 规范：

http://www.w3.org/TR/html5/forms.html#enabling-and-disabling-form-controls:-the-disabled-attribute ：

选中的内容属性是一个布尔属性

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

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

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

结论：

以下是有效的、等效的和真实的：

<input type="text" disabled />
<input type="text" disabled="" />
<input type="text" disabled="disabled" />
<input type="text" disabled="DiSaBlEd" />

以下是无效的：

<input type="text" disabled="0" />
<input type="text" disabled="1" />
<input type="text" disabled="false" />
<input type="text" disabled="true" />

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

<input type="text" />

推荐

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

Answer 3

我只是尝试了所有这些，对于 IE11，似乎唯一有效的是禁用 =“true”。 禁用或没有给定值的值不起作用。 事实上，jsp 得到一个错误，即所有字段都需要 equal，因此我必须指定 disabled="true" 才能使其工作。

Answer 4

在 HTML5 中，没有正确的值，所有主流浏览器并不真正关心属性是什么，它们只是检查属性是否存在，从而禁用元素。

Answer 5

来自 MDN 的 setAttribute()：

要设置布尔属性的值，例如disabled ，您可以指定任何值。 空字符串或属性名称是推荐值。 重要的是，如果该属性完全存在，无论其实际值如何，其值都被认为是true 。 缺少该属性意味着其值为false 。 通过将disabled属性的值设置为空字符串 ( "" )，我们将disabled设置为true ，这会导致按钮被禁用。

链接到 MDN

解决方案

• 我的意思是在XHTML Strict 中是正确的disabled="disabled" ，
• 并且在HTML5中仅被禁用，例如 <input name="myinput" disabled>
• 在JavaScript中，我通过e.disabled =真值设置为真;
  或为“”的setAttribute经由（ “无效”， “”）;

在 Chrome 中测试

var f = document.querySelectorAll( "label.disabled input" );
for( var i = 0; i < f.length; i++ )
{
    // Reference
    var e = f[ i ];

    // Actions
    e.setAttribute( "disabled", false|null|undefined|""|0|"disabled" );
    /*
        <input disabled="false"|"null"|"undefined"|empty|"0"|"disabled">
        e.getAttribute( "disabled" ) === "false"|"null"|"undefined"|""|"0"|"disabled"
        e.disabled === true
    */
    
    e.removeAttribute( "disabled" );
    /*
        <input>
        e.getAttribute( "disabled" ) === null
        e.disabled === false
    */

    e.disabled = false|null|undefined|""|0;
    /*
        <input>
        e.getAttribute( "disabled" ) === null|null|null|null|null
        e.disabled === false
    */

    e.disabled = true|" "|"disabled"|1;
    /*
        <input disabled>
        e.getAttribute( "disabled" ) === ""|""|""|""
        e.disabled === true
    */
}