html - 当您使用转义键退出 Web 浏览器中的某些内容时,例如模态对话框,焦点会放在哪里?

标签 html css browser focus accessibility

在大多数情况下,似乎没有任何视觉指示,这对于依赖键盘的用户来说一定很困难。

这似乎是一个非常简单的问题,但我已经搜索了互联网,但找不到答案。我的第一个想法是使用 Firefox 的开发者工具使用 *some element*:focus {outline: 2px solid red;} 创建视觉指示,但当然你需要知道哪个元素正在接收focus 让它工作,所以我尝试了通用选择器 *:focus {outline:2px solid red;} 但那没有用。

因此,任何人都可以回答这个看似简单的问题,即哪个元素正在获得关注......并且为了获得额外的荣誉,任何人都可以提供一个代码片段,让我能够真正看到正在发生的事情吗?

最佳答案

在模式对话框的情况下,焦点应该回到框出现之前的位置。

例如,如果对话框在单击按钮时出现,则焦点应在对话框关闭时返回到该按钮,无论它是如何关闭的(鼠标单击或在关闭按钮或退出键上输入)。

最容易通过键盘访问的应用程序和网站是那些您始终知道焦点在哪里的应用程序和网站。必须禁用模糊功能;它不应该存在。

关于html - 当您使用转义键退出 Web 浏览器中的某些内容时,例如模态对话框,焦点会放在哪里?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46119864/

相关文章:

java - 表中具有不同 id 的多个文件上传

javascript - 附加装饰为 html 元素的内容不起作用

javascript - 有没有办法在js插入后在浏览器中显示html源?

javascript - 如何从javascript引用延迟加载的脚本标签json文件内容?

PHP headless 浏览器?

javascript - 概述行为,同时关注点击并关注选项卡

html - 以文本居中 div

javascript - Angular.js - <md-backdrop> 在滚动的、静态定位的父容器中可能无法正常工作

html - 如何根据视口(viewport)高度修复 div 的高度?

html - CSS 动画背景颜色问题