Исключить зажатие клавиш javaScript

Question

У меня есть кусок кода, который двигает объект по экрану при помощи стрелок:

document.addEventListener('keydown', function(event) {

    switch (event.code) {

        case 'ArrowUp': { 
            //кусок кода
            break;
        }

        case 'ArrowDown': { 
            //кусок кода
            break;
        }

        case 'ArrowRight': {
            //кусок кода
            break;
        }

        case 'ArrowLeft': {
            //кусок кода
            break;
        }
    }
});

Я хочу исключить "зажатие" клавиш, когда мой объект "летит" по всему экрану очень быстро. Знаю, что есть такое свойство event.repeat, которое отвечает за "залипание" клавиши, пытался добавлять для каждой клавиши проверку и прерывание исполнения кода в случае, если клавиша зажата:

if (event.repeat) break;

Объект перестает "разгоняться" при зажатии клавиши, но и при повторном ее нажатии никуда не идет, в общем, это не работает. Может есть какие-то способы?

Answer 1

попробуй

event.preventDefault();
event.stopPropagation(); //Прекращает дальнейшую передачу текущего события

Answer 2

Можно ввести флаг и одновременно хранилище для последней нажатой кнопки. Флаг указывает, что кнопка зажата и хранит какая именно. При отпускании кнопки флаг хранит пустую строку и повторное нажатие на ту же кнопку и любую другую "пропускается" и событие обрабатывается (вывожу в консоль).

Код не обрабатывает случаи одновременного зажатия нескольких клавиш.

let pressing_button = '';

document.addEventListener('keydown', e => {
            switch (e.code) {

            case 'ArrowUp': {
                if(pressing_button !== 'up'){
                    console.log('up');
                }
                pressing_button = 'up';
                break;
            }

            case 'ArrowDown': { 
                if(pressing_button !== 'down'){
                    console.log('down');
                }
                pressing_button = 'down';
                break;
            }

            case 'ArrowRight': {
                if(pressing_button !== 'right'){
                    console.log('right');
                }
                pressing_button = 'right';
                break;
            }

            case 'ArrowLeft': {
                if(pressing_button !== 'left'){
                    console.log('left');
                }
                pressing_button = 'left';
                break;
            }
        }
})

document.addEventListener('keyup', e => {
    pressing_button = '';
})

БЛОГ НА HUSL

Исключить зажатие клавиш javaScript

Ответы (2 шт):