为何会卡住
按钮靠形状与惯例提示可点击（Norman, 1999）。禁用按钮关掉这一信号却不说明原因，成为隐藏的可供性（Gaver, 1991；Friedman, 2021）。参见可供性。
保持可用并说明原因
清楚说明问题的表单完成率更高（Seckler et al., 2014）。点击后滚动到缺失字段并显示内联校验（Flaherty, 2024）。底部固定按钮旁也可加简短提示。
该禁用的时候
如支付中防止重复提交。状态要明确区分（Gordon, 2025）并显示“处理中…”。WCAG 2.2的1.4.3豁免禁用元素，但太浅会看不见。可考虑aria-disabled。
常见问题
- 禁用按钮总是不好吗？
- 不，说明原因时适合防止重复提交等场景。
- disabled与aria-disabled区别？
- 后者保留焦点，读屏可读出原因。
来源核查日期：2026-10-27
参考文献
- Friedman, V. (2021, August). Frustrating design patterns: Disabled buttons. Smashing Magazine. 禁用按钮的问题与替代方案。
- Gordon, K. (2025, April 25). Button states: Communicate interaction. Nielsen Norman Group. 区分按钮状态的方法。
- Flaherty, K. (2024, January 17). Indicators, validations, and notifications: Pick the correct communication option. Nielsen Norman Group. 指示与校验信息的选择。
- Seckler, M., Heinz, S., Bargas-Avila, J. A., Opwis, K., & Tuch, A. N. (2014). Designing usable web forms: Empirical evaluation of web form improvement guidelines. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 1275–1284). ACM. 清晰的错误指引帮助完成表单。
- Norman, D. A. (1999). Affordance, conventions, and design. Interactions, 6(3), 38–43. 感知可供性提示可点击。
- Gaver, W. W. (1991). Technology affordances. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 79–84). ACM. 隐藏与虚假可供性。
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. 1.4.3豁免与3.3.1。