This question already has answers here:
Prevent JavaScript keydown event from being handled multiple times while held down

(8个答案)


4年前关闭。




当用户按住某个键时,我希望keydown()事件仅被调用一次,但是直到用户停止按该键时才调用该事件。

这是我正在尝试做的事情:
   $(document).keydown(function(event){
     var keycode = (event.keyCode ? event.keyCode : event.which);
     if(keycode == '39'){
              $("#box").animate({"left": "+=30px"}, "fast");
     }
   });

因此,当用户按下向右箭头键时,我希望div#box向右移动30px。它会移动,但是如果用户按住键,它就会飞走。

我需要它每按一次仅移动30px,然后停止,即使用户按住该键也是如此。您知道如何实现吗?

最佳答案

跟踪哪些键被按下,并忽略键码39,直到键清除为止:

var down = {};

$(document).keydown(function(event){
     var keycode = (event.keyCode ? event.keyCode : event.which);
     if(keycode == '39'){
          if (down['39'] == null) { // first press
              $("#box").animate({"left": "+=30px"}, "fast");
              down['39'] = true; // record that the key's down
          }
     }
   });

$(document).keyup(function(event) {
     var keycode = (event.keyCode ? event.keyCode : event.which);
     down[keycode] = null;
});

10-05 21:03
查看更多