提升span与a元素键盘交互体验的研究
本文探讨如何使span和a元素具备键盘聚焦及点击功能，包括绑定点击事件、设置tabindex属性、应用WAI-ARIA角色、添加键盘事件监听以及处理默认行为，以增强无障碍访问性。
要让一个普通的span元素达到一个含button元素的键盘可访问性，我们需要如下处理：
- 首先，很显然的，绑定点击事件；
- 给元素设置
tabindex="0"属性，使得元素在tab键锚点切换的时候，可以获得焦点； - 使用
role属性告诉辅助设备（如屏幕阅读器）这个元素所扮演的角色，属于WAI-ARIA. 例如点击的按钮，就是role="button"；会让这个元素可点击； - 附加键盘事件，如
keydown, 然后当回车或空格键的时候，触发click事件； - 如果你是使用的
a元素伪造按钮，同时含有链接，比方说"#"或"##"，需禁用默认的点击行为，通过event.preventDefault()或return false.
扫一扫
50
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
