gpt4 book ai didi

accessibility - aria-live 和 JAWS

转载 作者:行者123 更新时间:2023-12-03 04:57:39 25 4
gpt4 key购买 nike

我正在尝试让 aria-live 区域能够与 JAWS 11 和 IE8 正常工作。

使用下面的代码,我可以让 JAWS 在单击按钮时宣布新值,但行为不是我所期望的。

JSFiddle of this example

<!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 区域的先前值?

我还对其他屏幕阅读器如何处理此功能感兴趣。

最佳答案

您的代码是正确的。显然,“后面的1”已经是discovered 。从链接来看,使用 aria-atomic="true"似乎可以解决该问题。但是,给出的示例确实在 IE9 和 Firefox 中正常工作。

如果您还没有偶然发现它们,请查看 codetalks 上的测试用例和 accessibleculture.org 。有很多细微的差别需要注意。当测试失败时不要感到惊讶!在过去一年左右的时间里,我遇到了一些(不充分的)技巧,可能会对您有所帮助。

方法一:role="alert"

alert 角色是 supposed to be相当于 aria-live="assertive",但旧版本的 JAWS 无法正确处理它。查看these examples从 2011 年 2 月开始,其中指出:

If you are looking to support JAWS 10 in IE7 or IE8 at all, it is likely best to double up on alerts with both role="alert" and aria-live="assertive". While this is somewhat redundant since, by definition, the alert role is to be processed as an assertive live region, doing so does allow JAWS 10 to automatically announce the updated alert's contents in those two browsers.

Firefox4+ 和 IE9 都不需要这个。但它会是这样的:

<div id="statusbar" role="alert" aria-live="assertive">
Contents will be spoken when changed
</div>

方法二:焦点强制破解

通过动态创建 DOM 元素并强制将焦点置于其上,您可以“欺骗”大多数屏幕阅读器来阅读内容。这是很hackish,但是有效......并且在某种程度上是Create and Focus的要点。例子。简单来说,你可以这样做:

<div id="statusbar" role="alert"></div>

$('#statusbar')
.clear()
.append('<div tabindex="-1">' + newString + '</div>')
.children().first().focus()
;

大多数情况下,仅仅隐藏/显示内容实际上效果相当好。然而,VoiceOver的焦点停留在元素上,再次显示时不会说出其内容。因此,从 DOM 中删除它似乎是目前最简单的方法。我不喜欢这样,但事情就是这样。

关于accessibility - aria-live 和 JAWS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6908701/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com