Нужен невидимый / эстетически приятный ввод с клавиатуры для игры на JavaScript

Question

Я работаю над игровой веб-страницей, и мне нужно знать способ захвата ввода с клавиатуры, то есть вверх, вниз, влево и вправо, и передать его в переменную местоположения, но я не хочу использовать текстовое поле в моем HTML-код для ввода. Я уже использую элемент, чтобы нарисовать мой мир. Есть ли какой-нибудь способ, которым, когда игра открыта на вкладке, что весь ввод с клавиатуры, кроме как с различными клавишами оператора браузера, будет захватываться без необходимости нажатия пользователем на определенное место на экране. У меня очень ограниченный опыт работы с HTML, и мне нужен только конус ответа, поскольку я строю игру на python таким образом, чтобы она встраивалась в HTML.

Я также использую синхронизируемый цикл, и мне нужно иметь возможность включить событие onkeypress для захвата внутри синхронизированного цикла.

Какой элемент я должен использовать? Какие свойства элемента?

Answer 1

Для того, чтобы захватывать ваши нажатия именно внутри цикла, вам нужно где-то хранить текущие ключи и использовать document.onkeydown и document.onkeyup для их изменения.

var heldKeys = [];

document.onkeydown = function(ev) {
    heldKeys.push(ev.keyCode);
}

document.onkeyup = function(ev) {
    var i = heldKeys.indexOf(ev.keyCode);
    if (i != -1) {
        heldKeys.splice(i, 1);
    }
}

Теперьвнутри вашего цикла вы проверяете содержимое heldKeys.Вы можете просто пройти через него и воздействовать на каждую клавишу.

Помните, что коды клавиш не будут точно соответствовать "a", "b" и т. Д., Они будут кодами ascii.И вы можете или не можете столкнуться с проблемами совместимости браузера.