Question

这是我在JavaScript中的代码：

var changeIdValue =  function(id, value) {
document.getElementById(id).style.height = value;
};

document.getElementById ("balklongwaarde").addEventListener("click", function(){ changeIdValue("balklongwaarde", "60px")});

document.getElementById ("balklevensverwachting").addEventListener("click", function(){ changeIdValue("balklevensverwachting", "60px")});

document.getElementById ("balkhart").addEventListener("click", function(){ changeIdValue("balkhart", "60px")});

document.getElementById ("balklever").addEventListener("click", function(){ changeIdValue("balklever", "60px")});

document.getElementById("balkhersenen").addEventListener("click", function(){ changeIdValue("balkhersenen", "60px")});

我想在按下keyup后执行此代码....

有人知道怎么做？

Answer 1

document.body.onkeyup = function(e){
    if(e.keyCode == 32){
        //your code
    }
}

点击空格键后会执行此操作。

JSFiddle

Answer 2

在JQuery中，事件在which事件属性下进行了规范化。

您可以在此处找到任何键值例如：空格键值（32）。

此功能可以帮助您。

$(window).keypress(function(e) {
    if (e.which === 32) {

        //Your code goes here

    }
});

Answer 3

document.activeElement是任何有焦点的元素。你经常会找到空格键并在聚焦元素上输入点击。

document.body.onkeyup = function(e){
    if(e.keyCode == 32 || e.keyCode == 13){
        //spacebar or enter clicks focused element
        try {
            doc.activeElement.click();
        }
        catch (e) {
            console.log(e);
        }            
    }
};

然后CSS可能是：

.focusable-thing:hover {
    cursor: pointer;
}
.focusable-thing:focus {
    -webkit-box-shadow: 0px 2px 8px 2px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 2px 8px 2px rgba(0,0,0,0.4);
    box-shadow: 0px 2px 8px 2px rgba(0,0,0,0.4);
}

Answer 4

此版本的2019年版本为：（可在所有主流浏览器中使用-Chrome，Firefox，Safari）

规范链接-https://www.w3.org/TR/uievents/#dom-keyboardevent-code

代码包含一个字符串，用于标识所按下的物理键。该值不受当前键盘布局或修改器状态的影响，因此特定键将始终返回相同的值。此属性的未初始化值必须为“”（空字符串）。

// event = keyup or keydown
document.addEventListener('keyup', event => {
  if (event.code === 'Space') {
    console.log('Space pressed')
  }
})

Answer 5

keyCode is deprecated。您可以改用key（按键生成的字符）或code（键盘上的物理键）。根据键盘布局，使用一个或另一个可能会有不同的输出。

document.addEventListener('keydown', (e) => {
    if (e.key === "Space") {
        // Do your thing
    }
});

按空格键后执行JS代码

5 个答案: