HTML 属性：disabled

布尔型disabled属性，如果存在，则使元素不可变、不可聚焦，甚至不与表单一起提交。用户既不能编辑也不能聚焦该控件，也不能聚焦其表单控件后代。

试用

概述

如果在表单控件上指定了disabled属性，则该元素及其表单控件后代不参与约束验证。通常情况下，浏览器会将此类控件灰显，并且不会接收任何浏览事件，例如鼠标点击或与焦点相关的事件。

disabled属性受<button>、<fieldset>、<optgroup>、<option>、<select>、<textarea>和<input>支持。

此布尔型禁用属性表示用户无法与控件或其后代控件进行交互。如果未指定此属性，则控件将从包含元素（例如 fieldset）继承其设置；如果不存在具有 disabled 属性设置的包含元素，并且控件本身也不具有该属性，则控件处于启用状态。如果在 <optgroup> 上声明，则选择仍然可交互（除非另行禁用），但选项组中的任何项目均不可选择。

注意： 如果 <fieldset> 被禁用，则后代表单控件将全部被禁用，但 <legend> 中的表单控件除外。

当支持元素应用 disabled 属性时，:disabled 伪类也应用于它。相反，支持 disabled 属性但未设置该属性的元素将匹配 :enabled 伪类。

此布尔型属性可阻止用户与按钮交互。如果未设置此属性，则按钮仍可能从包含元素（例如 <fieldset>）中禁用；如果不存在具有 disabled 属性设置的包含元素，则按钮处于启用状态。

与其他浏览器不同，Firefox 会在页面加载之间保留 <button> 的动态禁用状态。使用 autocomplete 属性控制此功能。

属性交互

disabled 和 readonly 之间的区别在于，只读控件仍然可以正常工作并且仍然可获得焦点，而禁用控件则无法获得焦点并且不会与表单一起提交，并且通常在启用之前不会像控件一样工作。

由于禁用字段无法更改其值，因此 required 对也指定了 disabled 属性的输入没有任何影响。此外，由于元素变得不可变，大多数其他属性（如 pattern）将没有效果，直到控件被启用。

注意： required 属性在指定 disabled 属性的输入上不允许使用。

<fieldset>
  <legend>Checkboxes</legend>
  <p>
    <label>
      <input type="checkbox" name="chbox" value="regular" /> Regular
    </label>
  </p>
  <p>
    <label>
      <input type="checkbox" name="chbox" value="disabled" disabled /> disabled
    </label>
  </p>
</fieldset>

<fieldset>
  <legend>Radio buttons</legend>
  <p>
    <label> <input type="radio" name="radio" value="regular" /> Regular </label>
  </p>
  <p>
    <label>
      <input type="radio" name="radio" value="disabled" disabled /> disabled
    </label>
  </p>
</fieldset>

<p>
  <label
    >Select an option:
    <select>
      <optgroup label="Group 1">
        <option>Option 1.1</option>
      </optgroup>
      <optgroup label="Group 2">
        <option>Option 2.1</option>
        <option disabled>Option 2.2</option>
        <option>Option 2.3</option>
      </optgroup>
      <optgroup label="Group 3" disabled>
        <option>Disabled 3.1</option>
        <option>Disabled 3.2</option>
        <option>Disabled 3.3</option>
      </optgroup>
    </select>
  </label>
</p>

<fieldset disabled>
  <legend>Disabled fieldset</legend>
  <p>
    <label>
      Name: <input type="radio" name="radio" value="regular" /> Regular
    </label>
  </p>
  <p>
    <label>Number: <input type="number" /></label>
  </p>
</fieldset>

规范

规范
HTML 标准 # attr-fe-disabled
HTML 标准 # attr-optgroup-disabled
HTML 标准 # attr-option-disabled

:disabled 和 :enabled

HTML 属性：disabled

试用

概述

属性交互

可用性

约束验证

示例

规范

浏览器兼容性

html.elements.button.disabled

html.elements.fieldset.disabled

html.elements.input.disabled

html.elements.optgroup.disabled

html.elements.option.disabled

html.elements.select.disabled

html.elements.textarea.disabled

另请参阅