提交按钮处于加载状态时应使用哪种ARIA role？

结论很明确：不需要修改角色，保留原生<button>的role=button就好，理由如下：

1. 核心语义没变：这个元素从始至终都是「提交按钮」，加载状态只是它的临时状态——本质还是用来触发提交操作的控件，只是当前不可用并在反馈处理进度。如果改成progressbar，反而会混淆它的核心身份，让辅助技术用户困惑。

2. 禁用属性已经足够传递状态：给按钮加上disabled属性后，屏幕阅读器会自动识别并告知用户「此按钮暂时无法交互」，这已经清晰传递了当前状态，不需要额外修改角色。

3. progressbar有额外要求：如果硬要改成role=progressbar，还得补充aria-valuenow、aria-valuemin、aria-valuemax这些属性来完整描述进度，但大多数提交场景里我们只有「加载中」的模糊状态，没有具体进度值，反而画蛇添足。

4. 主流组件库的验证：你提到的那些组件库的实现逻辑都是保留按钮角色，只添加加载视觉反馈和禁用属性，这种方案已经经过无障碍测试，是成熟的做法。

正确的实现方式 #

• 点击按钮后，立即添加disabled属性，防止重复提交
• 在按钮内部插入加载图标（比如 spinner），替换或补充原有的按钮文本
• 可选：添加aria-busy="true"属性，进一步强化告知辅助技术当前元素处于忙碌处理状态

内容的提问来源于stack exchange，提问作者allevo