Отключить прокрутку клавиш со стрелками в браузере пользователей
Я делаю игру, используя холст и javascript.
когда страница длиннее экрана (комментарии и т. д.) клавишей стрелка вниз прокручивает страницу вниз, и делает игру невозможно играть.
Что я могу сделать, чтобы предотвратить прокрутку окна, когда игрок просто хочет двигаться вниз?
Я думаю, что с Java-играми, и такими, это не проблема, пока пользователь нажимает на игру.
Я попробовал решение от: как отключить прокрутку страницы в FF с помощью клавиш со стрелками, но я не мог заставить его работать.
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