跳到主要内容

交互模式 · 状态反馈

禁用状态

Disabled State

也叫:disabled、置灰、不可用状态

元素暂时不能操作时的样式,通常颜色变浅、鼠标显示禁止符号,点击后没有任何反应。

示例

详细解释

禁用状态告诉用户「这个现在用不了」。常见场景:必填项没填完时提交按钮置灰、提交中防止重复点击、没有权限的操作、没选中任何行时的批量删除按钮。给按钮或输入框加 HTML 的 disabled 属性,浏览器会自动阻止点击和聚焦。

样式上一般改成浅灰色或降低透明度,鼠标显示 cursor: not-allowed。但只置灰不说原因,用户会困惑「为什么点不了」,可以在旁边写明,或悬停时用文字提示说明原因。

有时更好的做法是不禁用:允许用户点提交,再用表单校验指出哪里没填,反馈更直接。

开发者信息
术语 ID
interaction-disabled-state
DOM 选择器
没有 DOM 线索,这个概念不在页面上直接识别。
优先级
1 · 同一层有多条命中时,优先级高的胜出
版本
v1 · 更新于 2026/09/29