无障碍表单

共 17 题
#

1. aria-required/aria-invalid 在错误状态可访问描述的工程价值

A 优先用原生 required,aria-invalid 在校验失败时设置、成功时清除,配合错误文字呈现 ✓ 正确答案
B aria-invalid 只是视觉样式
C aria-required 只用于读屏,不影响校验
D 校验失败后无需清除 aria-invalid
#

2. aria-describedby/aria-errormessage 在表单错误信息关联的工程价值

A aria-describedby 关联描述/帮助/错误,aria-errormessage 专门关联错误且需配合 aria-invalid="true" ✓ 正确答案
B aria-errormessage 无需 aria-invalid 即可生效
C 两者可任意替换
D aria-describedby 指向不存在的 id 也可生效
#

3. ARIA live region 与 aria-describedby 在表单错误提示的协作

A 二者都会重复播报,应只用其一
B live region 主动播报错误汇总,aria-describedby 在聚焦字段时关联具体错误,二者互补 ✓ 正确答案
C aria-describedby 负责主动播报
D live region 负责字段关联
#

4. 表单验证的无障碍反馈,aria-live 与错误关联?

A 只需视觉红框即可
B 用 aria-live 播报错误、aria-invalid/describedby 关联字段、并管理焦点到第一个错误 ✓ 正确答案
C 错误反馈无需焦点管理
D 验证错误只播报一次即可,无需关联字段
#

5. 自定义滑块(range)等复杂控件的无障碍,role=slider、aria-valuenow/valuetext、方向键操作与读屏播报如何实现?

A 滑块不需要 aria-valuetext
B 优先自定义而非原生 range
C 调整值后焦点应跳到别处
D 用 role=slider + aria-valuenow/min/max/valuetext,方向键调值且焦点保持在滑块上 ✓ 正确答案
#

6. label 关联、错误提示 aria-describedby、required、aria-invalid

A label 提供名称,aria-describedby 关联错误/帮助,required 表达必填,aria-invalid 标记无效 ✓ 正确答案
B 表单控件可以没有 label
C aria-describedby 关联不存在的 id 也没关系
D required 与 aria-invalid 含义相同
#

7. autocomplete=one-time-code/inputmode=numeric 在 OTP/数字键盘输入的工程价值

A OTP 输入框无需 label
B autocomplete="one-time-code" 支持自动填充验证码,inputmode="numeric" 弹出数字键盘 ✓ 正确答案
C 验证码输入应使用 type="number"
D autocomplete 与无障碍无关
#

8. 可访问的日期选择器与复杂控件

A 日期选择器无需键盘操作
B 只提供视觉日历即可
C 应提供手动输入替代视觉日历,并实现方向键选择、Enter/Esc、焦点管理 ✓ 正确答案
D 焦点无需归还
#

9. 表单字段的分组与描述,fieldset/legend、aria-labelledby 在多控件分组中的正确用法?

A 相关控件用 fieldset/legend 分组,无法用 Fieldset 时用 role="group" + aria-labelledby ✓ 正确答案
B 分组不需要语义
C aria-labelledby 优先级低于 aria-label
D 单选组用 role="group" 即可无需 radiogroup
#

10. 键盘可达性,Tab 顺序、焦点可见性(focus-visible)、Enter/Esc 交互在自定义控件中的实现?

A 用 tabindex=0 控制 Tab 顺序、:focus-visible 提供焦点环、自定义按钮实现 Enter 触发、弹层实现 Esc 关闭 ✓ 正确答案
B 自定义控件无需焦点可见性
C Enter 只对原生 button 有效
D 自定义控件不需要 Esc
#

11. 表单的键盘可达性,焦点管理与错误提示?

A 提交失败后把焦点移到第一个错误字段,并用 aria-invalid/describedby 关联错误提示 ✓ 正确答案
B 提交失败无需移动焦点
C 表单错误只需视觉提示
D 表单控件不需要 Tab 顺序
#

12. 表单验证失败的可访问反馈

A 错误只需关联一次,无需焦点管理
B 只需视觉红框即可
C 验证失败无需播报
D 通过 aria-live 播报、aria-invalid/describedby 关联、焦点定位、视觉提示四者协同实现 ✓ 正确答案
#

13. 无障碍表单的自动化测试,axe-core 扫描 + 键盘导航模拟如何纳入 CI?

A axe-core 扫描静态规则 + 键盘导航模拟验证焦点/行为,两者纳入 CI 防止回归 ✓ 正确答案
B 只需 axe 扫描即可
C 自动化测试无法测试表单
D 键盘模拟只能人工完成
#

14. 屏幕阅读器适配,label、aria-describedby 的使用?

A aria-describedby 提供名称
B label 与 aria-describedby 功能相同
C 无 label 的控件读屏也能识别
D label 提供控件名称,aria-describedby 提供帮助/错误描述,读屏依次播报名称与描述 ✓ 正确答案
#

15. 复杂控件(日期选择器)的无障碍实现?

A 焦点无需归还
B 只保留弹层日历即可
C 日期选择器无需键盘
D 提供手动输入替代 + 日历网格键盘导航 + 焦点管理,是复杂控件无障碍的核心 ✓ 正确答案
#

16. 表单的无障碍测试,键盘与读屏验证?

A 表单无需读屏测试
B 只需键盘测试
C 读屏测试可完全自动化
D 键盘测试验证 Tab 顺序/焦点/错误定位,读屏测试验证 label/错误播报,二者结合 ✓ 正确答案
#

17. 表单校验失败后的焦点与通告策略,focus 到第一条错误字段、aria-live 错误汇总与防止读屏重复播报的边界?

A 焦点留在提交按钮即可
B live 与 describedby 同时播报同一错误也无妨
C 焦点移到第一个错误字段,live 播报错误汇总,字段具体错误靠聚焦时读,避免重复播报 ✓ 正确答案
D 无需 aria-live 播报