简体   繁体   English

仅sr不能在Internet Explorer中工作

[英]sr-only not working in Internet Explorer

I have a live region where a button when clicked increments the count value displayed(similar to votes/likes). 我有一个直播区域,单击该按钮会增加显示的计数值(类似于投票/点赞)。 The message to be read out by the screen reader is a computed value, example: "1 person likes this article"/"No one has liked this article"/"8 people like this article". 屏幕阅读器要读出的消息是一个计算值,例如:“ 1个人喜欢这篇文章” /“没有人喜欢这篇文章” /“ 8个人喜欢这篇文章”。 These messages are computed in the client script(count value) and defined in the server script(final message) . 这些消息在客户端脚本(计数值)中计算,并在服务器脚本(最终消息)中定义

<div class="sr-only" role="alert" aria-live="polite">

   <span id="feedback-count">{{c.message}} /span>

</div>

This works perfectly in chrome but doesn't read out the message in IE in Windows using Jaws screen reader. 这在chrome中效果很好,但无法使用Jaws屏幕阅读器在Windows的IE中读出消息。

I tried a few approaches and this one works best for me, Fixed the issue and the screen reader text was read out perfectly in all browsers. 我尝试了几种方法,这种方法最适合我,解决了该问题,并且在所有浏览器中都完美读取了屏幕阅读器文本。

 functionToBeCalled = function(message) { aria_message = message; document.getElementById('screen-reader-tag-id').innerHTML = ''; document.getElementById('screen-reader-tag-id').innerHTML += '<p class="sr-only">'+ aria_message+'</p>' } 
 <div id="screen-reader-tag-id" class="sr-only" role="alert" aria-live="polite"> </div> 

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

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