2012-02-01 14 views
12

Gdy użytkownik trzyma wciśnięty klawisz, chcę, aby zdarzenie keydown() zostało wywołane tylko raz, ale zostanie wywołane do momentu, aż użytkownik przestanie naciskać klawisz.Jak wyłączyć powtarzalny keydown w jQuery

Oto co próbuję zrobić:

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

Tak więc, gdy użytkownik naciśnie klawisz strzałki w prawo, chcę # pudełko div przenieść 30px w prawo. Porusza się, ale jeśli użytkownik przytrzyma wciśnięty klawisz, odlatuje.

Potrzebuję go do przeniesienia tylko o 30 pikseli na każde naciśnięcie i zatrzymania, nawet jeśli użytkownik przytrzymuje naciśnięty klawisz. Czy wiesz, jak można to osiągnąć?

+2

W notatce dotyczącej wygody, 'event.keyCode? event.keyCode: event.which' jest odpowiednikiem 'event.keyCode || event.which ", nawet dla nie-Booleans. – Keen

Odpowiedz

17

Śledzić którego klucze są w dół, a ignorować keycode 39 aż keyup nawet czyści go:

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

Dziękuję za Twoje podejście! Zadziałało. Zaznaczam to jako poprawną odpowiedź. – Nazar

+1

Wierzę, że masz błąd składni? $ (dokument) .keyup (funkcja (zdarzenia) { var kodu dostępu = (event.keyCode event.keyCode: event.which) dół [kodu dostępu] = NULL; }); – Nazar

2

trzymać flagę i obróć go zielony na keydown Proponuję keyup choć

$(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"); 
     } 
    } 
    }); 
Powiązane problemy