Cómo atrapar la tecla de retroceso con jQuery?

Question

No parece que los métodos jQuery keyup, keydown o keypress se activen cuando se presiona la tecla de retroceso. ¿Cómo atraparía la presión de la tecla de retroceso?

Answer 1

prueba este:

$('html').keyup(function(e){if(e.keyCode == 8)alert('backspace trapped')}) 

Answer 2

Se puede usar javascript regular para atrapar la tecla de retroceso. Puede usar el método event.keyCode. El código clave es 8, por lo que el código sería algo como esto:

if (event.keyCode == 8) { 
    // Do stuff... 
} 

Si desea comprobar tanto para el [eliminar] (46), así como el [Retroceso] (8) teclas, utilice el siguiente :

if (event.keyCode == 8 || event.keyCode == 46) { 
    // Do stuff... 
} 

Answer 3

Trabajando en la misma idea que el anterior, pero generalizando un poco. Dado que el retroceso debería funcionar bien en los elementos de entrada, pero no debería funcionar si el foco es un párrafo o algo, ya que es allí donde la página tiende a volver a la página anterior en el historial.

$('html').on('keydown' , function(event) { 

     if(! $(event.target).is('input')) { 
      console.log(event.which); 
      //event.preventDefault(); 
      if(event.which == 8) { 
      // alert('backspace pressed'); 
      return false; 
     } 
     } 
}); 

return false => both event.preventDefault y event.stopPropagation están en vigor.

Answer 4

El comportamiento predeterminado para el retroceso en la mayoría de los navegadores es volver a la página anterior. Si lo hace no desea este comportamiento, necesita asegurarse de que la llamada preventDefault(). Sin embargo, como se mencionó al OP, si siempre lo llama al preventDefault(), también hará que sea imposible eliminar cosas en los campos de texto. El siguiente código tiene una solución adaptada de this answer.

Además, en lugar de usar valores de código clave codificados (algunos valores cambian según su navegador, aunque no he encontrado que esto sea cierto para Retroceso o Eliminar), jQuery has keyCode constants ya está definido. Esto hace que su código sea más legible y se ocupa de cualquier incoherencia de KeyCode por usted.

// Bind keydown event to this function. Replace document with jQuery selector 
// to only bind to that element. 
$(document).keydown(function(e){ 

    // Use jquery's constants rather than an unintuitive magic number. 
    // $.ui.keyCode.DELETE is also available. <- See how constants are better than '46'? 
    if (e.keyCode == $.ui.keyCode.BACKSPACE) { 

     // Filters out events coming from any of the following tags so Backspace 
     // will work when typing text, but not take the page back otherwise. 
     var rx = /INPUT|SELECT|TEXTAREA/i; 
     if(!rx.test(e.target.tagName) || e.target.disabled || e.target.readOnly){ 
      e.preventDefault(); 
     } 

     // Add your code here. 
    } 
});