7

在将 HTML 插入 DOM 时，我似乎无法让 NVDA 屏幕阅读器与 jQuery 一起工作。

我需要我的应用程序满足可访问性标准（例如 WAI-ARIA），并在 Ajax 回发时将动态内容添加到我的页面中。

这是我的代码没有被 NVDA 读取......我错过了什么？

<html>
<head>

<script language="javascript" type="text/javascript">
    function addText() {
        document.getElementById("test").innerHTML = "some test";
}
</script>
</head>

<body>
<h2>NVDA</h2>

<div id="testarea">Some test area</div>
<div id="test" aria-describedby="testarea" aria-live="polite" aria-relevant="additions removals" role="region"></div><br />

<input type="button" value="click me" onclick="addText()" />
</body>
</html>
4

1 回答 1

6

WCAG

这些是关于与内容更新相关的客户端脚本的 WCAG 建议：http: //www.w3.org/TR/WCAG20-TECHS/client-side-script.html

特别是到目前为止我发现

咏叹调

关于 ARIA 角色，请查看aria-live、和属性：aria-relevantaria-atomicalert

http://www.w3.org/TR/wai-aria/states_and_properties#aria-live

指示元素将被更新，并描述用户代理、辅助技术和用户可以从实时区域获得的更新类型。

http://www.w3.org/TR/wai-aria/states_and_properties#aria-relevant

指示辅助技术将在活动区域​​内接收哪些用户代理更改通知（添加、删除等）。请参阅相关的 aria-atomic。

http://www.w3.org/TR/wai-aria/states_and_properties#aria-atomic

根据 aria-relevant 属性定义的更改通知，指示辅助技术是显示全部还是部分更改区域。

http://www.w3.org/TR/wai-aria/states_and_properties#aria-hidden （如果 ajax 结果使页面的某些区域可见或隐藏）

表示该元素及其所有后代对于作者实现的任何用户都是不可见或不可感知的。请参阅相关的 aria-disabled。

http://www.w3.org/TR/wai-aria/roles#alert

警报用于传达消息以提醒用户。在音频警告的情况下，这对于听力受损的用户来说是一种可访问的替代方案。警报角色在包含警报消息的节点上运行。警报是状态角色的特殊形式，将作为原子活动区域进行处理。

其他资源

有关 NVDA 屏幕阅读器和 ajax 更新和其他相关资源的可访问性的文章：

http://tink.co.uk/2009/06/screen-reader-support-for-ajax-live-regions/
http://www.paciellogroup.com/blog/2008/02/ajax-and-screen-读者内容访问问题/

http://ejohn.org/blog/ajax-accessibility/ （这里建议了一个关于更新内容的活动区域的代码片段）

<p id="users-desc">A list of the currently-connected users.</p>
<ol aria-live="polite" aria-relevant="additions removals"
    aria-describedby="users-desc" id="users">  
     ... 
 </ol>
于 2012-03-22T17:49:49.030 回答