javascript - 页面加载后强制聚焦 ~unique

标签 javascript html accessibility screen-readers wcag

信息:

屏幕阅读器:Jaws 14、Apple Voiceover

浏览器:IE、Chrome、火狐

所以我有一个网络流程,我试图通过屏幕阅读器访问它。现在由多个vms组成。在页眉中有一个跳转到主要内容的选项,因此用户可以跳过显示在流程的每个页面上的冗余页眉。我的问题是屏幕阅读器忽略了页面的主体。我能够使用以下代码来引起对内容的注意,屏幕阅读器将从那里读取。

 <script language="javascript">
    function reload() {
        window.location.href = "#page1";    
    }
</script>

然后是一个用作 anchor 的标签,如下所示:

<a name="page1" id ="page1></a>

这很好用,但现在它会跳过页面的标题。

所以我的问题是,有没有办法让焦点回到页面顶部,或者有更好的方法强制将内容加载到屏幕阅读器以线性方式阅读?

我只在 IE 中遇到过这个问题(是的,谁料到会这样)。 Voiceover 和 Jaws 14 在任何其他浏览器中都没有问题。

希望这个描述是清楚的,如果没有,我可以在需要时尝试详细说明。

感谢您的宝贵时间,非常感谢!

最佳答案

听起来你正在更新内容,由被忽略的主体推断,在这种情况下你可能想查看实时区域 https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions传达更新。

如果在没有动态更新的情况下点击跳过链接时正文无法发声,请发布 HTML。

关于javascript - 页面加载后强制聚焦 ~unique,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19038649/

相关文章:

javascript - 按 T​​ab 键切换至禁用字段,该字段将变为启用状态

javascript - Bootstrap - 工具提示中断 td 样式

css - 特定屏幕宽度的推荐字体大小

html - 可访问的自定义样式复选框

javascript正则表达式检查字符和数字以外的内容

php - 是否可以使用 JS/PHP 为网页中的元素动态分配 ID?

javascript - 选择某个元素的直接下一个

javascript - 如何获取鼠标在相对定位元素内的坐标?

html - 在 body 和 h1 的不同区域绘制的背景图像

flutter - 如何在按下按钮的同时增加文本大小?