如何在屏幕阅读器中跳过部分内容

Question

我希望能让屏幕阅读器跳过部分内容。 考虑以下HTML代码：

<div id="test" aria-labelledby="test>
   ...
   <div aria-hidden="true">Dont read this content. This content will be loaded from javascript</div>
   ...
</div>

尽管div设置了aria-hidden=true，但屏幕阅读器仍会读取内容。请帮忙跳过这段内容。

- Coder

---

你尝试添加 role="presentation" 属性了吗？ - wallop

Answer 1

您的代码看起来没问题，您是如何进行测试的？

并非所有浏览器/屏幕阅读器都支持此功能。

尝试设置style="display:none;"，因为目前这种方法更为广泛支持。

- Sanchez89

---

无法设置display:none样式，因为它应该对用户可见。只是想从屏幕阅读器中隐藏。 - Coder

你能告诉我们一些会被动态加载的示例内容吗？ - Sanchez89

是的。一些额外的div将被加载进来。<div>内容1</div><div>内容2</div>。屏幕阅读器会将其读作内容1，内容2。但我不希望它可读。 - Coder

如果内容包含链接，请在包装div上设置tabindex="-1"以防止其被选中。但归根结底，只有display: none才能百分之百地起作用，是的，有aria-hidden（或其他aria标签），但最终屏幕阅读器将决定读取什么。 - Sanchez89