Как исправить задержку в javascript keydown

Возможный дубликат:
Задержка перемещения JavaScript и несколько нажатий клавиш

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

c.addEventListener('keydown',this.check,true);
  function check(el) {
    var code = el.keyCode || el.which;
    if (code == 37 || code == 65){
    x -=1;
    }

    if (code == 39 || code == 68){
    x += 1;
    }

  el.preventDefault();
}

Ответы

Ответ 1

Вместо того, чтобы пытаться реагировать непосредственно на событие keydown, я предлагаю вам использовать события keydown и keyup для поддержания списка ключей, которые в настоящее время недоступны. Затем реализуйте "игровой цикл", который проверяет каждые x миллисекунд, какие ключи опущены, и соответственно обновлять дисплей.

var keyState = {};    
window.addEventListener('keydown',function(e){
    keyState[e.keyCode || e.which] = true;
},true);    
window.addEventListener('keyup',function(e){
    keyState[e.keyCode || e.which] = false;
},true);

x = 100;

function gameLoop() {
    if (keyState[37] || keyState[65]){
        x -= 1;
    }    
    if (keyState[39] || keyState[68]){
        x += 1;
    }

    // redraw/reposition your object here
    // also redraw/animate any objects not controlled by the user

    setTimeout(gameLoop, 10);
}    
gameLoop();

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

Я понимаю, что вы не можете реализовывать игру, но эта концепция "игрового цикла" должна работать для вас, как показано в этой простой демонстрации: http://jsfiddle.net/nnnnnn/gedk6/