Issue:我有一个正在努力解决的可访问性问题。我有一个有角度的网络应用程序。加载内容时会显示页面加载旋转器/指示器。当页面内容加载后，微调器将被隐藏。这个“div”永远不会从 DOM 中删除。
当显示加载 div 时，不会读取加载 div 的内容（通过 NVDA 或钳口）。
<div class='loading' aria-live='polite' aria-label='Do not refresh the page' tabindex="-1">Do not refresh the page</div>
我不想改变应用程序的结构，但可以使用“aria 标签”来解决这个问题，只是想知道我是否需要做更多的事情来使 aria-live 工作？
更新（2016 年 7 月 27 日）
进一步澄清：我不是从 DOM 中删除内容，而是使用 css 来显示/隐藏内容（display: none 到 display: block，反之亦然）
aria-live当元素带有以下内容时触发屏幕阅读器aria-live（或元素内的文本aria-live) 在 DOM 中添加或删除。相反，当您取消隐藏隐藏元素时，元素和文本都不会从 DOM 中添加或删除，因此该元素的aria-live财产不起作用。
要让屏幕阅读器宣布“不要刷新页面”，以下任一选项都可以解决问题：
- 您可以创建
<div class='loading' aria-live='polite'>元素及其文本内容从头开始，然后将该元素添加到 DOM。
- 或者你可以从一个空的开始
<div class='loading' aria-live='polite'>元素，然后填充其文本内容。
其他一些花絮：
- 只要元素内的文本是您想要朗读的内容，就可以省略该元素的
aria-label='Do not refresh the page'属性。
- 为了锦上添花，这不会有什么坏处包括一个rolediv 上的属性有aria-live http://www.w3.org/TR/2013/WD-wai-aria-practices-20130307/#chobet。如果您不确定要使用哪个角色，请选择
role="status"——这是一个相当安全的赌注。
- 当页面处于不再需要显示“请勿刷新页面”的状态时，请务必颠倒上述步骤。（也就是说，如果您选择第一个选项并将整个元素添加到DOM，从 DOM 中删除整个元素。或者，如果您选择第二个选项并填充了元素的文本内容，请清除该元素的文本内容。）
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
