NVDA读取两次动态添加的内容

Question

我正在努力使动态Web应用程序可以通过屏幕阅读器供视障人士访问，但我遇到了一个令人讨厌的问题。 当我使用JAWS测试我的代码（见下文）时，它可以很好地工作。 但是，当我使用NVDA时，我正在Firefox中通过该读取器读取动态添加的内容，而在IE9中则完全不读取。

以前有没有人见过这种行为？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <HEAD>
    <TITLE>Mike's Alert Test Page</TITLE>       
</HEAD>
<BODY>  
        <script type="text/javascript">
            function simulateErrors()
            {
                var elem = document.getElementById("inlineErrors");  

                if (elem != null && elem != undefined) {
                    elem.innerHTML = '<DIV role="alert">I am some alert text.</DIV>';
                }
            }
    </script>       
    <H1>Test Page</H1>
    <DIV ID="inlineErrors"  role="none"></DIV>
    <DIV ID="buttons">
        <!--<BUTTON onClick="simulateErrors()" type="button">Simulate Errors</BUTTON>-->
        <input type="submit" value="Simulate Errors" onClick="simulateErrors()"/>
    </DIV>
</BODY>

Answer 1

将role="log"和aria-live="assertive"设置为inlineErrors div。 然后只需将其他DIV插入该div中即可解决您的错误，并且只应将其读出一次。

查看此 jQuery库中的assertiveAnnounce函数，以了解可在许多不同浏览器中使用的代码。

NVDA读取两次动态添加的内容

问题描述

1 个解决方案

解决方案1
1 2014-12-15 00:50:39

NVDA读取两次动态添加的内容

问题描述

1 个解决方案

解决方案1 1 2014-12-15 00:50:39

解决方案1
1 2014-12-15 00:50:39