accessibility - 屏幕阅读器一致性问题

Question

我正在使用 Jaws 15 和 IE 8 来测试我的网站的可访问性，如果我在页面加载时有任何角色警报是 DOM 的一部分，那么我发现页面加载时角色警报有一些奇怪的问题 JAWS/NVDA 从不宣布警报。

在某些情况下，当我显示角色警报父容器的隐藏时，JAWS/NVDA 不会宣布角色警报，即:

<div clas="container">
  <div role="alert" tabindex=-1 class="validation-summary">
    <ul>
      <li> <a href=# >Please enter first name</a></li>
      <li> <a href=# >Please enter lastname</a></li>
    </ul>
  </div>
</div>

为了宣布它，我将注意力放在警报上，屏幕阅读器会多次阅读它，这让用户很烦。

有什么地方可以让我正确解决这类问题，还是屏幕阅读器有问题？

Answer 1

试试这个

<div clas="container">
  <div role="alert" aria-labelledby="abcd"tabindex=-1 class="validation-summary">
    <ul>
      <li> <h1 id="abcd"><a href=# >Please enter first name</a></h1></li>
      <li> <h1 id="abcd"><a href=# >Please enter lastname</a></h1></li>
    </ul>
  </div>
</div>