Question

我有一个带锚点的按钮，出于可访问性原因，我想用空格键触发。相反，当按钮处于焦点时，单击空格键会向下跳转页面。

<a href="stackoverflow.com">Go to Stack Overflow</a>

我尝试过吃空格键：

window.onkeydown = function(e) { 
  return !(e.keyCode == 32);
};

但当然这不是我想要的。我不确定是否将空格键键映射到回车键是一种智能解决方案，或者是否可能。如何使用纯JS触发空格键按钮？

Answer 1

您可能希望查看一个阻止默认解决方案：

window.onkeydown = function(event){
    if(event.keyCode === 32) {
        event.preventDefault();
        document.querySelector('a').click(); //This will trigger a click on the first <a> element.
    }
};

这将阻止空格键执行默认操作（发送空格），然后您可以将滚动添加到函数内部的命令下方。

Answer 2

为您的链接指定ID并尝试此操作：

var link = document.getElementById("link");

document.onkeydown = function (e) {
    if (e.keyCode == 32) {
        link.click();
    }
};

单击带空格键的按钮

2 个答案: