[英]How to make Javascript/jQuery key events work with Screen Readers
[英]Accessibility with screen-readers and JavaScript focus events?
我有一个表单,其中包含一些 JavaScript,可以在输入有效文本时前进到下一个字段(示例如下)。 我的问题是屏幕阅读器是如何处理的。 这会让读者感到困惑还是会检测到焦点的变化并将新字段读出给用户?
HTML
<form action="/some/action" method="post" role="form">
<legend>A Form</legend>
<label for="first_number">First Number</label>
<input id="first_number" name="first_number" required type="text" value="">
<label for="second_number">Second Number</label>
<input id="second_number" name="second_number" required type="text" value="">
<button type="submit">Submit</button>
</form>
JavaScript
(function (document, window) {
function getFocusCallback(current_focus, go) {
var check = document.getElementById(current_focus);
var el = document.getElementById(go);
var pat = new RegExp('^\\d{3}$');
return function callback() {
if (pat.test(check.value)) {
el.focus();
}
};
}
document.getElementById('first_number').addEventListener('input', getFocusCallback('first_number', 'second_number'));
})(document, window);
因此,在用户在第一个字段中输入三个数字后,将在第二个字段中调用 focus 方法。
我认为这里的问题是意外行为。 对于没有视力的用户,任何非标准行为都可能造成混淆,因为它的工作方式与其他网站不同。
此外,这是您在每个领域都会拥有的功能,还是只是其中一些领域? 如果您有多个具有不同行为的字段,那将特别令人困惑。
几年前有一个关于这个的很好的线索,有几个比我更了解的人的意见。 https://lists.w3.org/Archives/Public/w3c-wai-ig/2015AprJun/0162.html
您需要单击每个页面底部的“下一条消息”链接才能阅读线程中的所有消息。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.