我有一个PRE标签,随着时间的推移,它将被填充许多跨度。
这将是一个文本游戏的输出。我需要屏幕阅读器来阅读这个元素的每一个添加。
<pre id="winOutput" role="region" aria-live="assertive" aria-relevant="additions" class="outputText"></pre>
以上就是我尝试过的。NVDA不读取任何内容(用鼠标悬停线条时除外)。但是自动添加的javascript并没有被读取。
根据我的理解,咏叹调live="自信的";aria-relatent=";添加">是我需要的,但它不起作用。具体说明:我需要阅读添加的内容,之前的文本将保留在里面(并不时删除旧行)。
有人能解释一下这里需要什么吗?如果一个针对视障人士的游戏根本没有被阅读,它就不起作用。。。
尝试Chrome和Edge
编辑:如果我添加aria atomic,那么NVDA每次都会读取,但每次都会从START/Everything读取。
这可能是因为"添加";对于aria-relevant
说(强调我的):
元素节点添加到活动中的辅助功能树区域
如果我真的读到了,那么你必须为"添加一个新的DOM元素;添加";待公布。但听起来您只是在向<pre>
添加文本,而不是添加新节点。如果是,那么";文本";应为CCD_ 3的值。
我通常不指定CCD_ 4;添加文本";。如果您将向<pre>
添加节点/子级,并且不希望宣布它们,则使用";文本";将阻止节点被公布。但很少有节点和文本都被添加到元素中,并且都不希望被宣布。我会先从一个简单的现场区域开始,看看它听起来怎么样。
<pre id="winOutput" role="region" aria-live="polite" class="outputText"></pre>
顺便说一句,我会使用aria-live="polite"
(如上所示),因为很少有公告如此重要以至于需要";自信";。使用";自信的";可以吹走任何挂起的屏幕阅读器公告。
当发生断言更改时,用户代理或辅助技术可能会选择清除排队的更改。
aria-atomic
只是说是宣布只是更改还是整个文本。它对于倒计时计时器这样的东西很方便,其中文本从"0"变为"0";你有60秒";至";你有50秒的时间">在没有aria-atomic
的情况下,屏幕阅读器宣布">你有60秒";对于第一个改变50";对于第二个变化(因为"50"是句子中所有变化的部分)对于aria-atomic="true"
,第二个改变将宣布为">你有50秒的时间";。
更新:回答评论部分的几个问题。
如果您依赖";自信的";要清除待定的公告,请返回我之前的报价:
当发生确定的更改时,用户代理或辅助技术可能会选择清除排队的更改
;MAY";在规格中是大写的。我没有强调。因此,这表示挂起的公告可能会被清除,也可能不会。这取决于浏览器和/或屏幕阅读器。不能保证他们会被清除,所以你不能依赖这种行为。
关于role="log"
,规范中说
角色为
log
的元素具有礼貌的隐含aria-live
值。
因此,如果您同时拥有role="log"
和aria-live="assertive"
,那么您将得到什么行为还不确定。您有相互竞争的aria-live
值。
如果您有role="alert"
和aria-live="assertive"
,那么aria-live
是多余的。您已经获得了警报设置。
如果您指定的任何类型的role
是而不是活动区域(即,不是警报、日志或状态),则不应影响是否遵守aria-live
。但您必须非常仔细地阅读aria-live
的规范。有很多警告说用户代理或辅助技术应该做什么,但";应该";不是要求。它可能会也可能不会像你希望的那样工作。规范甚至说用户的屏幕阅读器设置可能会影响aria live的工作方式。
关于焦点,不必须在活动区域才能宣布更改。这就是生活区的伟大之处。无论焦点在哪里,他们都会在任何时候宣布更改。焦点必须在活动区域的唯一时间是设置了aria-live="off"
。
因此,在您的案例中,您的示例代码看起来是正确的(现在您确认将DOM元素添加到<pre>
中)。我建议在一些不同的浏览器(firefox、chrome、safari)上进行测试,并尝试使用一些不同的屏幕阅读器(jaws、nvda、画外音),看看它们中是否有任何一个的行为符合您的意愿。