ave*_*net 29 javascript accessibility screen-readers
加载网页时,屏幕阅读器(如OS X附带的,或Windows上的JAWS)将读取整个页面的内容.但是请说您的页面是动态的,并且当用户执行操作时,新内容会添加到页面中.为简单起见,假设您在某处显示消息<span>
.如何让屏幕阅读器阅读新消息?
Cou*_*sen 31
该WAI-ARIA规范定义了几种方法,使屏幕阅读器可以"看" DOM元素.支持的最佳方法是aria-live
属性.它有模式off
,polite
,assertive
和rude
.自信程度越高,就越有可能中断屏幕阅读器当前所说的内容.
以下内容已经在Firefox 3和Firefox 4.0b9下使用NVDA进行了测试:
<!DOCTYPE html>
<html>
<head>
<script src="js/jquery-1.4.2.min.js"></script>
</head>
<body>
<button onclick="$('#statusbar').html(new Date().toString())">Update</button>
<div id="statusbar" aria-live="assertive"></div>
</body>
Run Code Online (Sandbox Code Playgroud)
同样的事情可以完成与WAI-ARIA 角色 role="status"
和role="alert"
.我有不兼容的报告,但无法重现它们.
<div id="statusbar" role="status">...</div>
Run Code Online (Sandbox Code Playgroud)