Keylistener в Javascript

Я ищу KeyListener для игры, которую я разрабатываю на JavaScript. Я понятия не имею, как это будет работать в реальном коде, но это будет примерно так:

if(keyPress == upKey)
{
    playerSpriteX += 10;
}
else if(keyPress == downKey)
{
    playerSpriteY -= 10;
}

так далее...

Я искал его, и Google придумал вещи, связанные с AJAX, которые я пока не понимаю. Есть ли встроенная функция в JavaScript, которая делает это?

Ответ 1

Вот обновление для современных браузеров в 2019 году

let playerSpriteX = 0;

document.addEventListener('keyup', (e) => {
  if (e.code === "ArrowUp")        playerSpriteX += 10
  else if (e.code === "ArrowDown") playerSpriteX -= 10

  document.getElementById('test').innerHTML = 'playerSpriteX = ' + playerSpriteX;
});

Click on this window to focus it, and hit keys up and down
<br><br><br>
<div id="test">playerSpriteX = 0</div>

Ответ 2

Код

document.addEventListener('keydown', function(event){
    alert(event.keyCode);
} );

Это возвращает код ascii ключа. Если вам нужно представление ключа, используйте event.key (это вернет 'a', 'o', 'Alt'...)

Ответ 3

JSFIDDLE DEMO

Если вы не хотите, чтобы событие было непрерывным (если вы хотите, чтобы пользователь каждый раз отпускал ключ), измените onkeydown на onkeyup

window.onkeydown = function (e) {
    var code = e.keyCode ? e.keyCode : e.which;
    if (code === 38) { //up key
        alert('up');
    } else if (code === 40) { //down key
        alert('down');
    }
};

Ответ 4

Вы проверили небольшую библиотеку Mousetrap?

Mousetrap - простая библиотека для обработки быстрых клавиш в JavaScript.

Ответ 5

Чуть более удобочитаемое сравнение выполняется путем event.key в верхний регистр (я использовал onkeyup - нужно, чтобы событие запускалось один раз при каждом нажатии клавиши):

window.onkeyup = function(event) {
    let key = event.key.toUpperCase();
    if ( key == 'W' ) {
        // 'W' key is pressed
    } else if ( key == 'D' ) {
        // 'D' key is pressed
    }
}

Каждый ключ имеет свой собственный код, выведите его путем вывода значения переменной "ключ" (например, для клавиши со стрелкой вверх это будет "ARROWUP" - (приведено к верхнему регистру))