无法将 activeElement(Tab 键的焦点)完全重置为其默认位置

Can't fully reset activeElement (focus for the Tab key) to its default position

好的,我正在尝试从页面中间重置 activeElement,这样 Tab 键就会从顶部开始,就像页面一样刚刚刷新。

为此目的(在 FF 和 Chrome 中测试)我正在尝试使用 document.activeElement.blur()(从浏览器控制台)。结果,<a href></a> 的选择在视觉上被移除(很好)。 还有,运行 document.activeElement 在 运行 document.activeElement.blur() 之后 来自控制台显示

<body class="ng-tns-0-0">

哪个看起来不错(activeElement 现在是 body?)

但是,如果我关闭控制台并按下 Tab 键,焦点会出现在前一个 href 的旁边 - 不会出现在 link 上,那是专注于页面加载 + Tab键.

为什么以及如何解决该行为?

从可访问性的角度来看,问题出现了,因为页面的重要部分是用其他内容呈现的。需要重新开始的 Tab 键,例如新页面。

事实上,你不应该使用 blur(),甚至不应该存在这种方法。

  • 调用 blur() 后,您无法控制焦点的位置。它可能进入菜单栏、工具栏,甚至完全离开浏览器 and/or 没有鼠标就完全无法恢复。
  • 您在 firefox 和 chrome 中观察到的行为不是标准的,未在任何地方指定,可能取决于 OS and/or 浏览器设置,并且您没有完全控制它

如果您想返回到页面的第一个元素,最安全的解决方案可能是 关注第一个元素,而不是调用 blur() 并希望最好的。

为了可以通过键盘访问任何应用程序或网站,焦点必须始终处于控制之下,即您必须始终准确地知道它在哪里。由于 blur() 方法没有指定焦点的下一个位置,因此您在使用它时会失去对焦点的控制;所以你不应该使用它。据我所知,它可能没有合法用途。