Binding Pfeiltasten in jQuery außer in Ein- und TextArea-

Question

fand ich diese ausgezeichnete Frage über die Pfeiltasten, mit jQuery Bindung: Binding arrow keys in JS/jQuery mit einer großen Lösung von Sygmoral:

$(document).keydown(function(e) { 
    switch(e.which) { 
     case 37: // left 
     break; 

     case 38: // up 
     break; 

     case 39: // right 
     break; 

     case 40: // down 
     break; 

     default: return; // exit this handler for other keys 
    } 
    e.preventDefault(); // prevent the default action (scroll/move caret) 
}); 

AUSSER: Diese mit den Pfeiltasten verhindert von der Art zu arbeiten, wie sie normalerweise funktionieren würden, wenn der Fokus in einem Texteingabefeld liegt.

Wie würde ich diese Lösung ändern, damit die Pfeiltasten normal funktionieren, wenn der aktuelle Fokus in einem Eingabe-, Textbereich oder einem anderen bearbeitbaren Bereich liegt?

Answer 1

in einen Zustand versetzt, dies:

$(document).keydown(function(e) { 
    if(!$(e.target).is(':input, [contenteditable]')){ 
     switch(e.which){ 
      // the cases as is 
     } 
     e.preventDefault(); // prevent the default action (scroll/move caret) 
    } 
}); 

Answer 2

Sie event.target verwenden können, das Zielelement des Ereignisses zu erhalten, so dass Sie

var $target = $(e.target); 
if($target.is("input") || $target.is("textarea")) { 
    // 
} 

Answer 3

Ihr bearbeitbare Element eine gemeinsame Klasse kann überprüfen

$('.input').keypress(function(event) { 

    var charCode = (evt.which) ? evt.which : event.keyCode 

    switch(charCode) { 
     case 37: // left 
     break; 

     case 38: // up 
     break; 

     case 39: // right 
     break; 

     case 40: // down 
     break; 

     default: return; // exit this handler for other keys 
    } 
    e.preventDefault(); 
});