Question

我以前曾经尝试过代码，但是当我按住W时它会重复代码，但是如果我按下它，它将只执行一个代码。

window.addEventListener("keydown", checkKeyPressW, false);

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

var leftMarginCounter = 0;
var bottomMarginCounter = 0;

var leftMarginCounterToString = "";

function checkKeyPressA_D(keyPressed) {
    if(keyPressed.keyCode == "97") {
        if(player.style.marginLeft != "0px") {
            leftMarginCounter = leftMarginCounter - 1;
            leftMarginCounterToString = leftMarginCounter.toString();
            leftMarginCounterToString = leftMarginCounterToString + "px";
            player.style.marginLeft = leftMarginCounterToString;
        }
    }
    else if(keyPressed.keyCode == "100") {
        if(player.style.marginLeft != "1316px") {
            leftMarginCounter = leftMarginCounter + 1;
            leftMarginCounterToString = leftMarginCounter.toString();
            leftMarginCounterToString = leftMarginCounterToString + "px";
            player.style.marginLeft = leftMarginCounterToString;
        }
    }
};

function checkKeyPressW(keyPressedW) {
    if(keyPressedW.keyCode == "87") {
        console.log("Pressed w");
    }
}

Answer 1

JS演示：https://jsfiddle.net/utnqeLmf/1/

代码：

 window.addEventListener("keydown", checkKeyPressW,  {
      once : true
 });

From the docs

once一个布尔值，指示最多应调用侦听器添加一次后。如果为true，则监听器将自动调用时删除。

编辑

如果您想避免在连续按下按键时连续不断地按键，请将该事件更改为keyup

window.addEventListener("keyup", checkKeyPressW);

Answer 2

有一个名为repeat的属性，如果按住该键，则返回true

document.addEventListener('keydown', (event) => {
   if(event.repeat) {
      // key is being held down
   } else {
      // key is being pressed
   }
 });

按下键时如何触发事件

2 个答案: