简体   繁体   English

JAWS不会阅读动态内容。 IE11

[英]JAWS doesn't read dynamic content. IE11

I have a search form. 我有一个搜索表单。 When user submits form, ajax request is sent to the server. 当用户提交表单时,会向服务器发送ajax请求。 When the response comes, I update found items count value, but JAWS reads previous items count value. 当响应到来时,我更新了找到的项目计数值,但是JAWS读取了之前的项目计数值。 To get JAWS read new content I use aria attributes and role="status". 为了让JAWS读取新内容,我使用了aria属性和role =“status”。 But JAWS still doesn't work as expected. 但是JAWS仍然没有按预期工作。

What I've tried: Getting screen reader to read new content added with JavaScript , aria-live and JAWS , ARIA Live Regions and etc. 我尝试过: 让屏幕阅读器阅读添加了JavaScriptaria-live和JAWSARIA Live Regions等的新内容

What am I doing wrong? 我究竟做错了什么?

HTML HTML

<form class="search-form">
     <label class="keyword-search-input-label" for="keyword-search-input">
          <span class="hide">Search</span>
          <input class="form-control" type="text" id="keyword-search-input" name="keyword"/>
     </label>

     <button id="clear-field-button" type="reset">
          <span class="hide">Clear Search Field</span>
     </button>
     <button id="search-button" type="submit" aria-describedby="number-found-items">
          <span class="symbol-label">Search</span>
     </button>
</form>
<div id="number-found-items" role="status" aria-live="assertive" aria-atomic="true" aria-relevant="all">
      <span id="number-found">0</span>
      items found
</div>

JS JS

function updateNumberFound(value) {
    $numberFound.text(value || 0);
}

jsFiddle To reproduce the problem try to focus on search input, type some text and press search button, while JAWS is on. jsFiddle要重现问题,请尝试关注搜索输入,键入一些文本并按下搜索按钮,同时打开JAWS。

The correct way to do this is to use a role="log" region that is inserted into the document when it loads and is off screen. 执行此操作的正确方法是使用role =“log”区域,该区域在加载并插入屏幕时插入到文档中。 Then to append the text that you want announced to that region when updates occur. 然后,在更新发生时,将要宣布的文本附加到该区域。

I have modified your fiddle to include the a11yfy library's code which does this: https://jsfiddle.net/17mkL2n5/1/embedded/result/ 我修改了你的小提琴,包括a11yfy库的代码,它执行此操作: https//jsfiddle.net/17mkL2n5/1/embedded/result/

jQuery.a11yfy.assertiveAnnounce(value + ' items found');

I have tested this on OS X with VO, Windows with NVDA and Windows IE 11 with JAWS 14 and they all work correctly. 我已经在OS X上使用VO,使用NVDA的Windows和使用JAWS 14的Windows IE 11进行了测试,它们都能正常工作。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM