Блог

Главная - Вопросы по программированию - Как остановить перемещение полос прокрутки facebook после использования события onkeydown на javascript для игры canvas?

Как остановить перемещение полос прокрутки facebook после использования события onkeydown на javascript для игры canvas?

#javascript #facebook #html #canvas

#javascript #Facebook #HTML #canvas

Вопрос:

Я создал игру, используя элемент Canvas HTML5, Javascript для facebook. Вы можете посетить его здесь,http://apps.facebook.com/snaqe_game. Проблема, с которой я сталкиваюсь, заключается в том, что когда я нажимаю клавишу со стрелкой вниз, используемую для перемещения змеи, реализованной с использованием события Javascript onkeydown, игра работает нормально, но полосы прокрутки перемещаются вверх и вниз. Я попытался создать текстовое поле (#activ) и установить на него фокус. Это сработало, но когда я попытался сделать это невидимым, это не удалось. 

 document.onkeydown = function(event) {
    document.getElementById('activ').focus()
    if (!allowPressKeys) {
        return null;
    }
    var keyCode;
    if(event == null) {
        keyCode = window.event.keyCode;
    } else {
        keyCode = event.keyCode;
    }

    switch(keyCode) {
        case 37:
            if (direction != "right") {
                moveLeft();
            }
            break;

        case 38:
            if (direction != "down") {
                moveUp();
            }
            break;

        case 39:
            if (direction != "left") {
                moveRight();
            }
            break;

        case 40:
            if (direction != "up") {
                moveDown();
            }
            break;

        default:
            break;
    }
}

Ответ №1:

В конце вашей document.onkeydown функции (после строки 197 в snake.js ) добавьте

 if (event.preventDefault) { event.preventDefault(); }
if (event.stopPropagation) { event.stopPropagation(); }
return false;

Это не позволяет браузеру реагировать на событие, помимо выполнения вашей функции.

Вам также может потребоваться заменить return null; в строке 161 эти три строки.