Отключить прокрутку клавиш со стрелками в браузере пользователей



Я делаю игру, используя холст и javascript.



когда страница длиннее экрана (комментарии и т. д.) клавишей стрелка вниз прокручивает страницу вниз, и делает игру невозможно играть.



Что я могу сделать, чтобы предотвратить прокрутку окна, когда игрок просто хочет двигаться вниз?



Я думаю, что с Java-играми, и такими, это не проблема, пока пользователь нажимает на игру.



Я попробовал решение от: как отключить прокрутку страницы в FF с помощью клавиш со стрелками, но я не мог заставить его работать.

1104   2  

2 ответов:

резюме

просто запретить значение по умолчанию действие браузера:

window.addEventListener("keydown", function(e) {
    // space and arrow keys
    if([32, 37, 38, 39, 40].indexOf(e.keyCode) > -1) {
        e.preventDefault();
    }
}, false);

оригинальный ответ

я использовал следующую функцию в своей игре:

var keys = {};
window.addEventListener("keydown",
    function(e){
        keys[e.keyCode] = true;
        switch(e.keyCode){
            case 37: case 39: case 38:  case 40: // Arrow keys
            case 32: e.preventDefault(); break; // Space
            default: break; // do not block other keys
        }
    },
false);
window.addEventListener('keyup',
    function(e){
        keys[e.keyCode] = false;
    },
false);

волшебство происходит в e.preventDefault();. Это заблокирует действие по умолчанию события, в этом случае перемещение точки зрения браузера.

Если вам не нужны текущие состояния кнопки, вы можете просто отбросить keys и просто выбросить действие по умолчанию на клавишах со стрелками:

var arrow_keys_handler = function(e) {
    switch(e.keyCode){
        case 37: case 39: case 38:  case 40: // Arrow keys
        case 32: e.preventDefault(); break; // Space
        default: break; // do not block other keys
    }
};
window.addEventListener("keydown", arrow_keys_handler, false);

обратите внимание, что этот подход также позволяет удалить обработчик событий позже, если вам нужно повторно включить прокрутку клавиш со стрелками:

window.removeEventListener("keydown", arrow_keys_handler, false);

ссылки

для ремонтопригодности я бы прикрепил обработчик "блокировки" к самому элементу (в вашем случае, холст).

theCanvas.onkeydown = function (e) {
    if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
        e.view.event.preventDefault();
    }
}

почему бы просто не сделать window.event.preventDefault()? MDN гласит:

window.event является собственностью Microsoft Internet Explorer который доступен только при вызове обработчика событий DOM. Свой значение-это объект события, который в данный момент обрабатывается.

далее показания:

Comments

    Ничего не найдено.