Dan*_*che 15 accessibility wai-aria jaws-screen-reader
我正试图让一个咏叹调生活区域与JAWS 11和IE8正常工作.
使用下面的代码,我可以让JAWS在单击按钮时宣布新值,但行为不是我所期望的.
<!DOCTYPE html>
<html>
<head></head>
<body>
<button onclick="document.getElementById('statusbar').innerHTML = parseInt(document.getElementById('statusbar').innerHTML) + 1">Update</button>
<div id="statusbar" aria-live="polite">0</div>
</body>
</html>
使用我的JAWS11/IE8配置,每按一下按钮,我听到:
Click number HTML Value (after click) JAWS says ------------ ------------------------- --------- 1 1 "Update button 0" 2 2 "1" 3 3 "2"
问题,我的问题是:如何让JAWS公布aria-live区域的当前值,而不是aria-live区域的先前值？
我也对其他屏幕阅读器如何处理这个功能感兴趣.
Cou*_*sen 15
你的代码是正确的.显然,已经发现了"落后1" .从链接看起来好像使用aria-atomic="true"可能会解决问题.但是,给定的示例在IE9和Firefox 中可以正常工作.
如果您还没有偶然发现它们,请查看codetalks和accessibleculture.org上的测试用例.需要注意很多微妙的差异.测试失败时不要感到惊讶!在过去一年左右的时间里,我遇到了一些可能对你有帮助的(不合适的)技巧.
方法1: role="alert"
该alert角色应该是等效的aria-live="assertive",但旧版本的JAWS没有正确处理它.查看2011年2月的这些示例,其中指出:
如果您希望在IE7或IE8中支持JAWS 10,最好使用role ="alert"和aria-live ="assertive"来加倍警报.虽然这有点多余,因为根据定义,警报角色将被处理为一个自信的实时区域,这样做可以让JAWS 10自动在这两个浏览器中公布更新的警报内容.
Firefox4 +和IE9都不需要这个.但它会是这样的:
<div id="statusbar" role="alert" aria-live="assertive">
Contents will be spoken when changed
</div>
方法2:集中强迫黑客攻击
通过动态创建DOM元素并强制关注它,您可以"欺骗"大多数屏幕阅读器阅读内容.它是hackish,但有效......而且有点是Create和Focus示例的重点.简化,您可以这样做:
<div id="statusbar" role="alert"></div>
$('#statusbar')
.clear()
.append('<div tabindex="-1">' + newString + '</div>')
.children().first().focus()
;
仅隐藏/显示内容实际上在大多数情况下工作得相当好.但是,VoiceOver的重点在于元素,并且在再次显示时不会说出其内容.因此,从DOM中删除它似乎是目前最简单的方法.我不喜欢它,但事情就是这样.
| 归档时间： |
|
| 查看次数： |
14508 次 |
| 最近记录： |