用途:在审查已渲染的 HTML、交互组件或设计系统模式时,检查模态对话框(modal dialog)是否对键盘用户可访问。资料指出,若缺少焦点陷阱与键盘处理,模态框会变成键盘用户的“隐形陷阱”,无法导航、退出或完成任务。
主要能力与检查要点:
- 模态容器使用 role='dialog' 与 aria-modal='true'。
- 焦点应被限制在模态内部,Tab 键只在模态内循环。
- 按 Escape 键关闭模态,并将焦点返回触发元素。
- 使用 aria-labelledby 指向模态标题。
使用方式:按检查、修复、解释、代码审查等模式使用。审查时针对已渲染标记与交互状态,指出违反规则的具体元素、角色、标签、焦点行为或键盘交互,并说明如何用浏览器无障碍工具或辅助技术验证修复。完整实现细节、代码示例与框架专属指引见 references/rule.md。规则页:https://frontendchecklist.io/rules/accessibility/modal-accessibility。
限制:资料未提供具体框架实现、收费或平台信息。