我如何检测当一个方向键被按下?我用这个找到了答案:

function checkKey(e) {
    var event = window.event ? window.event : e;
    console.log(event.keyCode)
}

虽然它适用于所有其他键,但它不适用于方向键(可能是因为浏览器默认情况下应该在这些键上滚动)。


当前回答

这个图书馆真棒! https://craig.is/killing/mice

Mousetrap.bind('up up down down left right left right b a enter', function() {
    highlight([21, 22, 23]);
});

不过,您需要快速按下序列以突出显示该页中的代码。

其他回答

我是这样做的:

var leftKey = 37, upKey = 38, rightKey = 39, downKey = 40;
var keystate;
document.addEventListener("keydown", function (e) {
    keystate[e.keyCode] = true;
});
document.addEventListener("keyup", function (e) {
    delete keystate[e.keyCode];
});

if (keystate[leftKey]) {
//code to be executed when left arrow key is pushed.
}
if (keystate[upKey]) {
//code to be executed when up arrow key is pushed.
}
if (keystate[rightKey]) {
//code to be executed when right arrow key is pushed.
}
if (keystate[downKey]) {
//code to be executed when down arrow key is pushed.
}

事件。钥匙== "ArrowRight"..

使用event.key。不再有任意的数字代码!如果您正在编译或知道您的用户都使用现代浏览器,请使用这个!

node.addEventListener('keydown', function(event) {
    const key = event.key; // "ArrowRight", "ArrowLeft", "ArrowUp", or "ArrowDown"
});

详细的处理:

switch (event.key) {
    case "ArrowLeft":
        // Left pressed
        break;
    case "ArrowRight":
        // Right pressed
        break;
    case "ArrowUp":
        // Up pressed
        break;
    case "ArrowDown":
        // Down pressed
        break;
}

现代开关处理:

const callback = {
    "ArrowLeft"  : leftHandler,
    "ArrowRight" : rightHandler,
    "ArrowUp"    : upHandler,
    "ArrowDown"  : downHandler,
}[event.key]
callback?.()

注意:旧属性(。keyCode和.which)已弃用。

“w”,“a”,“s”,“d”表示方向,使用event.code

为了支持使用非qwerty/English键盘布局的用户,您应该使用event.code。这将保留物理键的位置,即使导致字符发生变化。

事件。关键是,在德沃夏克和z在艾泽里,让你的游戏无法玩。

const {code} = event
if (code === "KeyW") // KeyA, KeyS, KeyD

最理想的情况是,你还允许按键重新映射,无论玩家处于何种情况,这都对他们有利。

注:事件。箭头的代码也是一样的

关键Mozilla文档

代码Mozilla文档

支持的浏览器

这是短的。

函数IsArrows (e) { return (e.keyCode >= 37 && e.keyCode <= 40); }

如果你使用jquery,你也可以这样做,

 $(document).on("keydown", '.class_name', function (event) {
    if (event.keyCode == 37) {
        console.log('left arrow pressed');
    }
    if (event.keyCode == 38) {
        console.log('up arrow pressed');
    }
    if (event.keyCode == 39) {
        console.log('right arrow pressed');
    }
    if (event.keyCode == 40) {
        console.log('down arrow pressed');
    }
 });

如果你想检测箭头按键,但不需要特定的Javascript

function checkKey(e) {
   if (e.keyCode !== 38 || e.keyCode !== 40 || e.keyCode !== 37 || e.keyCode !== 39){
    // do something
   };
}