NVDA 屏幕阅读器未在 Internet Explorer 中读取 aria-labelledby 和 aria- describeby

【问题标题】：NVDA screen reader is not reading aria-labelledby and aria-describedby in Internet ExplorerNVDA 屏幕阅读器未在 Internet Explorer 中读取 aria-labelledby 和 aria- describeby
【发布时间】：2017-02-17 16:35:08
【问题描述】：

我开始研究可访问性。 aria-labelledby 和 aria- describeby 在 Chrome 和 Firefox 中运行良好，但 NVDA 在 IE 中无法正确读取。

<div id="div1">div 1</div>
<div id="div2">div 2</div>
<div>div 3</div>
<button aria-labelledby="div1 div2 buttonName1"><span id="buttonName1">Test1</span></button>
<br>
<button aria-describedby="div1 div2 buttonName2"><span id="buttonName2">Test2</span></button>

【问题讨论】：

哪个版本的IE？哪个版本的 NVDA？
IE 10、Edge、IE 11 和 NVDA 2016.2.1
啊，那我下面的回答肯定适用。至于 Edge，那是一个完全不同的浏览器，并且没有使用与 IE 相同的钩子。通常 NVDA 和 JAWS 用户会避免使用它，但它适用于讲述人。

标签： accessibility wai-aria screen-readers nvda

【解决方案1】：

这是 Internet Explorer 中的一个已知错误。由于开发工作集中在 Edge 上，因此不太可能修复。因此，许多 NVDA 用户与 Firefox 配对。

IE 11 不支持带有单个或多个 id 引用的 aria-labelledby 或 aria-describedby除非引用的元素是 Microsoft 将其归类为可访问元素的元素。 IE 不可访问元素可以通过添加 tabindex="-1"（如文档所示）或通过添加 ARIA role（在适当时）变成可访问元素。

（不幸的）例子：

<p tabindex="-1" id="label-1">label text</p>
...
<input type="text" aria-labelledby="label-1">

【讨论】：