在 HTML 和 JavaScript 中设置屏幕阅读器（对讲）的初始焦点

Question

我有这个旧网站，仅使用 HTML、CSS 和 javaScript。（无 React）。它使用回话来阅读网站。但当屏幕阅读器模式打开时，它没有初始焦点。当我四处移动时它会开始聚焦。如何仅使用 HTML、CSS 和 javaScript 设置初始焦点？

我已经尝试过：

document.querySelector('#foo\bar').focus()

但它只设置浏览器焦点。

Answer 1

您要聚焦的元素必须是可聚焦的（如输入）。您可以在没有 js 的情况下完成此操作，只需将“autofocus”添加到您的 html 元素中，如下所示：

<input type="text" id="myInput" name="myInput" autofocus />

或者你也可以像这样用js来做：

document.querySelector("#myInput").focus();

您在问题中提供了有效的js，因此问题可能是您试图聚焦一个不可聚焦的元素。以下是关于哪些元素可聚焦的答案 哪些 HTML 元素可以接收焦点？

如果这不能解决您的问题，可能是 Talk Back 辅助功能焦点问题 Android Talkback 未注册 Web 版 onFocus。如何使用 Android Talkback 操纵辅助功能焦点？

Answer 2

记住，如果你想聚焦在默认情况下不接收焦点的元素上，则必须添加属性 tabindex="-1"

示例：

<p tabindex="-1">Page Title</p>