KeyDown нажатой левой не обновляется для KeyUp

У меня есть объект на canvas, что я хотел бы перейти с событиями клавиатуры,KeyDown нажатой левой не обновляется для KeyUp

Моя функция событие следующим образом

function onKeyDown(evt) { 
if (evt.keyCode == 40) { downDown = true;} 
if (evt.keyCode == 39) { rightDown = true;} 
if (evt.keyCode == 38) { upDown = true;} 
if (evt.keyCode == 37) { leftDown = true;} 
}

и моя onKeyUp функция то же самое, кроме как с false в качестве значения

тогда я придаю как

$(document).keydown(onKeyDown); 
$(document).keyup(onKeyUp);

У меня есть функция отрисовки, которая вызывается в моей инициализации, как intv = setInterval(draw, 10); со следующими утверждениями

      if (rightDown) { x += dx;} 
          if (upDown) { y -= dy;} 
          if (downDown) { y += dy;} 
          if (leftDown) {x -= dx;}

Все, кроме -x направлении (влево вниз) работает хорошо. Так что я могу перемещать объект вверх, вправо и вниз. Когда левая нажата, объект продолжает движение влево. Устанавливаются ли мои условные утверждения неправильно?

Полный демо на http://jsfiddle.net/avSvu/

источник

2011-02-10 phwd

Не могли бы вы опубликовать демо? возможно, на http://jsfiddle.net/ – Soumya

@ Soumya92 http://jsfiddle.net/avSvu/ – phwd

Глупое маленькое демо, которое я сделал с использованием двух варов, не знаю, помогает ли это ... (http: // www. jsfiddle.net/bradchristie/jL2u2/1/) –

function onKeyUp(evt) { 
    if (evt.keyCode == 40) { downDown = false;} 
    ... 

    //  v----- capital K ? 
    if (evt.KeyCode == 37) { leftDown = false;} 
}

Живая демонстрация:http://jsfiddle.net/avSvu/5/

источник

2011-02-10 20:11:31

Ты прибил его, хорошая работа. Я посмотрел на это на 5 минут и не видел. Я виню выбор шрифта jsFiddle. ; p –

@Philippe Проверьте ссылку в ответе выше. Это ваш точный код, но с капиталом K исправлено. Как вы можете видеть, он работает, как только вы это исправите. –

Я вижу это сейчас oO Я настолько слеп. Еще раз спасибо. – phwd

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

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset=utf-8 /> 
    <title></title> 
    </head> 
    <body> 

    <div id="out1"></div> 
    <div id="out2"></div> 

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>  
    <script type="text/javascript"> 


     (function(){ 

     var downDown = false; 
     var rightDown = false; 
     var upDown = false; 
     var leftDown = false; 

     function onKeyUpDown(evt,isDown) { 
      var keyCode = evt.keyCode; 
      jQuery("#out1").html(keyCode); 
      if (keyCode == 40) { downDown = isDown;} 
      else if (keyCode == 39) { rightDown = isDown;} 
      else if (keyCode == 38) { upDown = isDown;} 
      else if (keyCode == 37) { leftDown = isDown;} 
     } 

     jQuery(document).keydown(function(evt){onKeyUpDown(evt,true);}).keyup(function(evt){onKeyUpDown(evt,false);}); 

     window.setInterval(
      function(){ 
      var upDownTxt = upDown?"up":"-"; ; 
      var downDownTxt = downDown?"down":"-"; 
      var leftDownTxt = leftDown?"left":"-"; 
      var rightDownTxt = rightDown?"right":"-"; 
      jQuery("#out2").html(upDownTxt + "<br/>" + downDownTxt + "<br/>" + leftDownTxt + "<br/>" + rightDownTxt); 
      }, 
      100); 

     })(); 

    </script>  
    </body> 
</html>

http://jsbin.com/edavi3/edit

источник

2011-02-10 20:15:41 epascarello

Это очень хорошо, хотя я до сих пор не понимаю, почему одно из направлений не работает, пока другие. – phwd

Здесь я вновь факторизуется код:

$(function() { 
    var x = 150, 
     y = 150, 
     dx = 2, 
     dy = 2,   
     canvas = $('#canvas'), 
     ctx = canvas[0].getContext('2d'), 
     width = canvas.width(), 
     height = canvas.height(), 
     keys = {}, 
     intervalId = 0; 

    function circle(x, y, r) { 
     ctx.beginPath(); 
     ctx.arc(x, y, r, 0, Math.PI * 2, true); 
     ctx.closePath(); 
     ctx.fill(); 
    } 

    $(document).keydown(function(e) { keys[e.which] = true; }); 
    $(document).keyup(function(e) { keys[e.which] = false; }); 

    intervalId = setInterval(function() { 
     ctx.clearRect(0, 0, width, height); 
     x = x - (keys['37'] ? dx : 0) + (keys['39'] ? dx : 0); 
     y = y - (keys['38'] ? dy : 0) + (keys['40'] ? dy : 0); 
     circle(x, y, 10); 
    }, 20); 
});

Живая демонстрация:http://jsfiddle.net/avSvu/4/

источник

2011-02-10 20:37:01

KeyDown нажатой левой не обновляется для KeyUp

ответ

Смежные вопросы