1

我有这个简单的现场区域：

<div aria-atomic="true" role="alert" id="AlertText"></div>

现在在 FF+Windows 讲述人中，实时区域工作正常，我更改了文本，并且警报按预期出现。然而，原始警报文本实际上非常复杂且带有 BR 和 H2 标签。问题是每次在文本中到达关闭标签时，警报都会显示“可编辑文本”。

我想将警报移动到没有标签的隐藏实时区域，但即使警报工作得很好，但当它到达警报角色 div 的结束标记（即我的示例中的 DIV#AlertText）时，它说“可编辑文本”在FF。

现在在 IE 中它没有这个问题，MacOS Narrator 也没有它，它只是令人困惑。

我担心有人会听到它并认为它是文本输入或其他东西（尽管它在文本输入字段上说“编辑文本”）。

我更愿意将原始容器作为警报角色，但我根本不能让它多次说“编辑文本”，或者普通用户和 FF 用户已经习惯了......对此的任何帮助表示赞赏。

我目前正在开发 Win8.1 Narrator。

编辑：独立 HTML 中的实时代码示例（但是我没有让这个示例在 Win Narrator 中工作）

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Role Alert Test</title>
    </head>
    <body>
        <button id="btnAlert" href="#">Set Text</button>
        <div aria-atomic="true" role="alert" aria-live="assertive" aria-relevant="additions text">
            <div class="AccessibleVersion-OverviewHeadingContainer">
                <h2 class="AccessibleVersion-SubHeading" id="AccessibleVersion-SubHeading-Overview">Overview</h2>
            </div>

            <div class="AccessibleVersion-OverviewTextContainer" aria-labelledby="AccessibleVersion-SubHeading-Overview" id="overviewText"></div>
            <br />
            <h2 class="AccessibleVersion-SubHeading" id="AccessibleVersion-SubHeading-OverviewHistory">Annual dividend history for the last five years</h2>
            <div id="annualDividendText" aria-labelledby="AccessibleVersion-SubHeading-OverviewHistory"></div>
        </div>

        <script type="text/javascript">
            document.getElementById('btnAlert').onclick = function() {
                var dom = document.getElementById('overviewText');

                dom.appendChild(document.createTextNode("The latest dividend of Almarai Company for Almarai is equal to 1.00 Saudi Riyal per share. The ex-date was on 06/04/2015 and it was paid on 14/04/2015. The dividend type is Annual."));
                dom.appendChild(document.createElement('br'));
                dom.appendChild(document.createTextNode("Current dividend yield is equal to 1.90 percent."));
                dom.appendChild(document.createElement('br'));
                dom.appendChild(document.createTextNode("52 weeks dividend sum is equal to 1.00 Saudi Riyal."));
                dom.appendChild(document.createElement('br'));
                dom.appendChild(document.createTextNode("Total return, calculated with dividends reinvested, is equal to -38 percent for the past 12 months and +62 percent for the past 3 years."));


                dom = document.getElementById('annualDividendText');
                dom.appendChild(document.createTextNode("2011: total dividend 1.50 Saudi Riyal, dividend yield (based on year-end share price) 3.91 percent."));
                dom.appendChild(document.createElement('br'));
                dom.appendChild(document.createTextNode("2012: total dividend 0.83 Saudi Riyal, dividend yield 1.96 percent."));
                dom.appendChild(document.createElement('br'));
                dom.appendChild(document.createTextNode("2013: total dividend 1.00 Saudi Riyal, dividend yield 1.90 percent."));
                dom.appendChild(document.createElement('br'));
                dom.appendChild(document.createTextNode("2014: total dividend 1.00 Saudi Riyal, dividend yield 1.30 percent."));

            };
        </script>
    </body>
</html>
4

0 回答 0