Jav*_*tez 11 html javascript jquery accessibility
是否有一种默认方式可以在任何时候在焦点元素上按下 enter 时触发点击事件?
我所指的是在专注于 a 时<button>按 Enter 与在专注于 a<div> <li> <span>等时按 Enter 的区别。<button>按键enter按预期触发。但是,<div>按键enter没有任何作用。我相信您必须专门为该按键编写事件。
$('li').click(function() {
//toggles something
});
$("li").keydown(function(e){
if(e.which === 13){
$(this).click();
}
});
Run Code Online (Sandbox Code Playgroud)
Ada*_*dam 11
是否有一种默认方式可以在任何时候在焦点元素上按下 enter 时触发点击事件?
没有javascript就没有解决方案。
尽管W3C 提到了onclick它的特殊行为
虽然 "onclick" 听起来像是绑定到鼠标,但 onclick 事件实际上映射到链接或按钮的默认操作。
这不适用于链接和按钮以外的其他元素。
您可能会想添加role="button"到div带有tabindex="0". 这不起作用。
在Mozilla的文件明确地说,你必须定义处理程序,即使有button作用。
这很容易理解,因为这是浏览器功能。当你定义role=link一个元素时,你不能右键单击它,希望它会打开你的浏览器上下文菜单。出于同样的原因,定义role=button属性不会影响默认行为。从这个讨论:
ARIA 只是传达了作者想要传达给辅助技术的可访问性语义。
也不要忘记处理space钥匙。阅读有关该主题的 Karl Groves 文章和示例。
小智 5
如果页面上的元素已经有点击事件,并且在 Tab 键顺序中,并且您只想让 Enter 键触发点击任何具有可访问性焦点的元素,请尝试以下操作:
<head>
<script>?
function handleEnter(e){?
var keycode = (e.keyCode ? e.keyCode : e.which);?
if (keycode == '13') {?
document.activeElement.click();?
}?
}?
</script>?
</head>?
?
<body onkeypress="handleEnter(event)">
Run Code Online (Sandbox Code Playgroud)
这对于添加播放/暂停以及在使用 Google Web Designer 制作的横幅广告中访问其他基于图像的控件特别有用。