当您使用退出键退出Web浏览器中的某些内容时,如模式对话框,焦点在哪里?

当您使用退出键退出Web浏览器中的某些内容时,如模式对话框,焦点在哪里?

问题描述:

在大多数情况下,似乎没有任何视觉指示,对于依赖键盘的用户来说这一点很难实现。当您使用退出键退出Web浏览器中的某些内容时,如模式对话框,焦点在哪里?

这似乎很简单的问题,但我已经走遍了互联网,并不能找到答案。我的第一个想法是使用Firefox的开发工具来创建使用*some element*:focus {outline: 2px solid red;}但当然,你需要已经知道哪些内容是重点接收该工作的视觉指示,所以我试图通用选择*:focus {outline:2px solid red;}但没有奏效。

因此,谁能回答什么元素获得焦点的看似简单的问题...和奖励荣誉谁能提供一段代码,让我真正看到发生了什么?

+0

有趣的问题,我也想知道答案。确认你的'focus'没有被其他选择器覆盖。试试'*:focus {outline:2px solid red!important;}'。这对我在随机网站上测试工作。 – jfeferman

+0

谢谢@jfeferman,那不是问题,但我忘记了在诊断过程中使用'!important'是很好的做法;如果你忘了,你可以浪费很多时间。从进一步的调查中可以看出,重点正在移出视口之外......我只是不知道在哪里。 – DragonFist

+0

如果您使用VoiceOver等辅助功能技术,您可以直观地追踪焦点。另外,请看[activeElement](https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement)。这可以给你一个关于焦点元素的js句柄。 – jfeferman

在一个模式对话框的情况下,重点要回去的地方,它是禁区前出现。例如,如果在单击按钮时出现对话框,则在对话框关闭时焦点应该返回到该按钮,而不管它是如何关闭的(鼠标单击或在关闭按钮或退出键上输入) 。

最键盘访问应用程序和网站是那些你总是知道在哪里的重点是。模糊功能必须禁止;它永远不会存在。