:enabled - CSS（层叠样式表） 编辑

CSS 伪类 :enabled 表示任何被启用的（enabled）元素。如果一个元素能够被激活（如选择、点击或接受文本输入），或者能够获取焦点，则该元素是启用的。元素也有一个禁用的状态（disabled state），在被禁用时，元素不能被激活或获取焦点。

/* 选择任何启用状态的 <input> */
input:enabled {
  color: blue;
}

语法

:enabled

示例

下面的代码，当文本输入框处于启用状态时，输入框 <input> 的文本是绿色的，处于禁用状态时，输入框的文本则是灰色的。这样可以把元素是否可用反馈给用户。

HTML：

<form action="url_of_form">
  <label for="FirstField">First field (enabled):</label>
  <input type="text" id="FirstField" value="Lorem"><br>

  <label for="SecondField">Second field (disabled):</label>
  <input type="text" id="SecondField" value="Ipsum" disabled="disabled"><br>

  <input type="button" value="Submit">
</form>

CSS：

input:enabled {
  color: #2b2;
}

input:disabled {
  color: #aaa;
}

结果

规范

规范	状态	备注
HTML Living Standard :enabled	Living Standard	No change.
HTML5 :enabled	Recommendation	Defines the semantics for HTML and forms.
Selectors Level 4 :enabled	Working Draft	No change.
Selectors Level 3 :enabled	Recommendation	Defines the pseudo-class, but not the associated semantics.

浏览器兼容性

BCD tables only load in the browser

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

参见

• :disabled