jQuery: keyPress Backspace non si attiva?


186

Mi chiedo cosa sto facendo di sbagliato:

$(".s").keypress(function(e) {
   switch (e.keyCode) {
      case 8: // Backspace
      //console.log('backspace');
      case 9: // Tab
      case 13: // Enter
      case 37: // Left
      case 38: // Up
      case 39: // Right
      case 40: // Down
         break;

      default:
         doSearch();
   }
});

Voglio le mie doSearch() funzione venga attivata quando premo il Backspacetasto. Al momento non succede assolutamente nulla quando premo Backspacesu Chrome e Safari.

qualche idea?


Puoi provare questo plug-in jQuery code.google.com/p/js-hotkeys e utilizzare l'alias chiave "backspace"
José Manuel Lucas

3
non si accende su Chrome ma su Firefox.
vsync,

Ci scusiamo per il necropostaggio, ma vale la pena notare che e. Quale è preferito su e.keyCode
Henry Howeson

Risposte:


324

Usa keyupinvece di keypress. Questo ottiene tutti i codici chiave quando l'utente preme qualcosa


37
Perché keyupsparare per Backspace quando keypressno?
Aaron Digulla,

è il caso. Keyup attiva backspace, keypress no -> strano. c'è la possibilità di verificare anche se due tasti sono premuti come cmd-c, o cmd-v o cmd-a
matt

17
In realtà dipende dalla chiave. Si desidera utilizzare keypressper Enterchiave, keydownper Backspacee così via; in caso contrario, in alcuni browser gli eventi non funzionano davvero come previsto, soprattutto quando si desidera impedire il comportamento predefinito della chiave. Quando usi quello sbagliato, ciò che accadrà è che il tuo evento non viene affatto catturato (come nel caso di Backspace) o non puoi impedirlo; poiché si verifica già prima che il codice di gestione degli eventi arrivi ad esso.
srcspider,

5
Il problema di questa risposta è che l'uso keyupsarà rompere il tastierino numerico . Conosci una risposta che consente di rilevare correttamente qualsiasi tasto su una tastiera completa?
hughes,

6
keydownè l'opzione migliore per tutte le chiavi
artfuldev,

32

Me ne sono imbattuto da solo. L'ho usato .onquindi sembra un po 'diverso ma ho fatto questo:

 $('#element').on('keypress', function() {
   //code to be executed
 }).on('keydown', function(e) {
   if (e.keyCode==8)
     $('element').trigger('keypress');
 });

Aggiungendo il mio lavoro qui intorno. Ho dovuto eliminare ssn digitato dall'utente, quindi l'ho fatto in jQuery

  $(this).bind("keydown", function (event) {
        // Allow: backspace, delete
        if (event.keyCode == 46 || event.keyCode == 8) 
        {
            var tempField = $(this).attr('name');
            var hiddenID = tempField.substr(tempField.indexOf('_') + 1);
            $('#' + hiddenID).val('');
            $(this).val('')
            return;
        }  // Allow: tab, escape, and enter
        else if (event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||
        // Allow: Ctrl+A
        (event.keyCode == 65 && event.ctrlKey === true) ||
        // Allow: home, end, left, right
        (event.keyCode >= 35 && event.keyCode <= 39)) {
            // let it happen, don't do anything
            return;
        }
        else 
        {
            // Ensure that it is a number and stop the keypress
            if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) &&       (event.keyCode < 96 || event.keyCode > 105)) 
            {
                event.preventDefault();
            }
        }
    });

1
funziona con firefox se usi event.which invece di event.keyCode api.jquery.com/event.which
BishopZ,

11

Se si desidera attivare l'evento solo su modifiche del proprio input, utilizzare:

$('.s').bind('input', function(){
  console.log("search!");
  doSearch();
});

inputinoltre non osserva keyCodes. Neanche questo funzionerebbe.
Mark Pieszak - Trilon.io

3

Secondo la documentazione di jQuery per .keypress (), non rileva i caratteri non stampabili, quindi il backspace non funzionerà con il keypress, ma viene catturato nel keydown e nel keyup:

L'evento keypress viene inviato a un elemento quando il browser registra l'input da tastiera. Questo è simile all'evento keydown, ad eccezione del fatto che i modificatori e i tasti non stampabili come Shift, Esc ed eliminano gli eventi trigger keydown ma non gli eventi keypress. Altre differenze tra i due eventi possono sorgere a seconda della piattaforma e del browser. ( https://api.jquery.com/keypress/ )

In alcuni casi il keyup non è desiderato o ha altri effetti indesiderati e il keydown è sufficiente, quindi un modo per gestirlo è usare keydownper catturare tutte le sequenze di tasti quindi impostare un timeout di un breve intervallo in modo che il tasto venga inserito, quindi eseguire l'elaborazione in lì dopo.

jQuery(el).keydown( function() { 
    var that = this; setTimeout( function(){ 
           /** Code that processes backspace, etc. **/ 
     }, 100 );  
 } );
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.