Cómo deshabilitar la tecla repetitiva en jQuery

Question

Cuando el usuario mantiene presionada una tecla, quiero que el evento keydown() se invoque solo una vez, pero se invoca hasta que el usuario deja de presionar la tecla.

Aquí es lo que estoy tratando de hacer:

$(document).keydown(function(event){ 
    var keycode = (event.keyCode ? event.keyCode : event.which); 
    if(keycode == '39'){ 
       $("#box").animate({"left": "+=30px"}, "fast"); 
    } 
    }); 

Así, cuando el usuario pulsa la tecla de flecha derecha, quiero que el cuadro # div para mover 30px a la derecha. Se mueve pero si el usuario mantiene presionada la tecla, se aleja volando.

Necesito que se mueva solo 30px por pulsación, y se detenga, incluso si el usuario mantiene presionada la tecla. ¿Sabes cómo se puede lograr?

Answer 1

Realizar un seguimiento de qué claves están abajo, y hacer caso omiso código clave 39 hasta que un keyup siquiera lo aclara:

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; 
}); 

Answer 2

mantener una bandera y se volverá verde sobre keydown Yo sugeriría keyup aunque

$(document).keydown(function(event){ 
    $flag=false; 
    var keycode = (event.keyCode ? event.keyCode : event.which); 

     if(keycode == '39'){ 
      if(!$flag){ 
       $flag=true; 
       $("#box").animate({"left": "+=30px"}, "fast"); 
     } 
    } 
    });