Jquery Tastendruckereignis ignorieren Pfeiltasten

Question

Ich habe ein Eingabefeld, das sich wie eine Suche verhält (ähnlich wie Facebook). Ich benutze die Jquery auf Tastendruck-Ereignis, das funktioniert gut. Das Problem ist, dass ich nicht auf die Menge der Ergebnisse mit den Pfeiltasten nach unten scrollen kann, jedes Mal, wenn einer von ihnen gedrückt wird, werden die Suchergebnisse neu generiert. So ist es möglich, den Pfeiltasten/Shift/Tab usw.

http://jsfiddle.net/UU6KG/

$("#search-form .search-terms").on("keypress", function(){ 
     $("#search-items #autocom").fadeIn(); 
    }); 

Dank

Answer 1

Sie müssen ignorieren die Pfeiltastencodes, um herauszufiltern (37,38,39,40), versuchen Sie dies:

Beachten Sie die function(e) anstelle von function() - damit können Sie das Ereignis und damit den Schlüsselcode greifen.

$('#search-form .search-terms').on('keydown', function(e){ 
    // get keycode of current keypress event 
    var code = (e.keyCode || e.which); 

    // do nothing if it's an arrow key 
    if(code == 37 || code == 38 || code == 39 || code == 40) { 
     return; 
    } 

    // do normal behaviour for any other key 
    $('#search-items #autocom').fadeIn(); 
}); 

Click for a list of key codes

Ein Hinweis aus der Dokumentation auf keypress/keyup/keydown:

Beachten Sie, dass keyDown und einen Code keyup zu liefern, das anzeigt, welche Taste gedrückt wird, während keypress zeigt welches Zeichen wurde eingegeben? Zum Beispiel wird ein Kleinbuchstabe "a" als 65 mit Keydown und Keyup, aber als 97 per Tastendruck gemeldet. Ein Großbuchstabe "A" wird von allen Ereignissen als 65 gemeldet. Aufgrund dieser Unterscheidung ist das .keydown() oder .keyup() eine bessere Wahl, wenn spezielle Tastenanschläge wie Pfeiltasten eingefangen werden.

Die keypress Veranstaltung in fast allen Situationen funktioniert, aber es ist klug keyup oder keydown zu verwenden, da einige Browser (ich glaube, einige ältere Version von Firefox) nicht bestimmte Tasten erkennen, wie Pfeiltasten, Verwenden des keypress Ereignisses.

Answer 2

$(".search-terms").live('keydown',function(event){     
if(event.which>=37 && event.which<=40) 
       { 
        reutrn; 

       } 

Answer 3

Ich würde auch vorschlagen, dass Sie andere Schlüssel ignorieren sollten, die nicht direkt zu einer neuen Abfrage führen sollten. Tasten wie shift, scroll-lock und end, zum Beispiel. Nach dem gleichen keycode list Beratung, die verbunden @theyetiman, kam ich mit diesem, wenn Anweisung alle Schlüssel zu ignorieren, sollte keine Rolle spielen (die Swap von keypress für keyup beachten Erfassung von wichtigen Schlüssel wie backspace zu ermöglichen):

$('.search-terms').on('keyup', function(ev) { 
    if ((ev.keyCode > = 9 && ev.keyCode <= 45) || (ev.keyCode >= 91 || ev.keyCode <= 93) || (ev.keyCode >= 112 || ev.keyCode <= 145)) { 
     return; 
    } 
});