给定下面的代码，对于使用屏幕阅读器导航的用户，myHyperlink.onclick JavaScript 是否仍会在用户点击该超链接时执行并取消事件？我的目标是让使用屏幕阅读器导航的用户直接导航到 http://www.google.com，因为他们无论如何都不会真正看到图像。
<!DOCTYPE html>
<html>
<head>
<title>Accessibility?</title>
<script>
window.onload = function() {
var myHyperlink = document.getElementById("slider-nav");
myHyperlink.onclick = function() {
document.getElementById("about-google").style.display = "block";
return false;
};
};
</script>
</head>
<body>
<div id="main">
<a href="http://www.google.com" id="slider-nav">Google</a>
<div id="about-google" style="display:none;">
<a href="http://www.google.com">
<img src="https://www.google.com/images/srpr/logo3w.png" alt="Google logo" />
</a>
</div>
</div>
</body>
</html>
Code also available from JSFiddle.
对于上下文，我正在尝试使轮播/ slider 小部件对屏幕阅读器更友好。
最佳答案
无论链接是由视力正常的用户使用鼠标激活、视力正常的用户使用键盘激活还是屏幕阅读器使用键盘激活，浏览器的行为都没有区别。在所有情况下，您的 onclick 处理程序都会被调用， Logo 会显示，导航会被取消。对于键盘用户(无论是否有视力)，键盘焦点将保留在初始文本链接上。视力正常的用户会看到新图像出现，屏幕阅读器用户听不到任何声音，并且可能会想知道为什么什么都没有发生。
您可以自己尝试:download the free NVDA screenreader (如果您觉得有用，请捐款)，并针对在 IE 或 Firefox 中运行的页面进行尝试(Chrome 对可访问性的支持略有滞后，但正在迎头 catch 。)对于 JSFiddle 页面，使用结果通常更容易一个独立的页面而不是一个 Pane ，您可以通过拉出框架 URL 并将其粘贴到新的浏览器页面来实现 - http://fiddle.jshell.net/DXUqr/show/在你的情况下。 NVDA 不是唯一的屏幕阅读器，但它与任何用于检查基本网络可访问性的屏幕阅读器一样好。
(一般来说，首先无法确定用户是否在使用屏幕阅读器。最好的办法是编写适用于所有用户的易于访问的 HTML。)
关于javascript - 当 JavaScript 取消超链接 `click` 事件时，屏幕阅读器会做什么？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13390096/