Pregunta jQuery Event Keypress: ¿Qué tecla se presionó?


Con jQuery, ¿cómo puedo saber qué tecla se presionó cuando me vinculé al evento de pulsación de tecla?

$('#searchbox input').bind('keypress', function(e) {});

Quiero activar un envío cuando ENTRAR se presiona.

[Actualizar]

A pesar de que encontré la (o mejor: una) respuesta a mí mismo, parece que hay margen para la variación;)

¿Hay alguna diferencia entre keyCode y which - Especialmente si solo estoy buscando ENTRAR, que nunca será una clave Unicode?

¿Algunos navegadores proporcionan una propiedad y otras proporcionan la otra?


670
2017-11-19 14:59


origen


Respuestas:


En realidad, esto es mejor:

 var code = e.keyCode || e.which;
 if(code == 13) { //Enter keycode
   //Do something
 }

803
2017-11-19 15:07



Prueba esto

$('#searchbox input').bind('keypress', function(e) {
    if(e.keyCode==13){
        // Enter pressed... do anything here...
    }
});

127
2017-11-19 15:05



Si está utilizando jQuery UI, tiene traducciones para códigos de tecla comunes. En ui / ui / ui.core.js:

$.ui.keyCode = { 
    ...
    ENTER: 13, 
    ...
};

También hay algunas traducciones en tests / simulate / jquery.simulate.js pero no pude encontrar ninguna en la biblioteca core JS. Eso sí, me limité a grep'ed las fuentes. Tal vez hay alguna otra forma de deshacerse de estos números mágicos.

También puede hacer uso de String.charCodeAt y .fromCharCode:

>>> String.charCodeAt('\r') == 13
true
>>> String.fromCharCode(13) == '\r'
true

60
2017-11-19 16:22



Dado que estás usando jQuery, deberías usar .which. Sí, los navegadores diferentes establecen propiedades diferentes, pero jQuery los normalizará y establecerá el valor .which en cada caso. Ver documetación en http://api.jquery.com/keydown/ afirma:

Para determinar qué tecla se presionó, podemos examinar el objeto de evento que se pasa a la función de controlador. Si bien los navegadores usan propiedades diferentes para almacenar esta información, jQuery normaliza la propiedad .which para que podamos usarla de manera confiable para recuperar el código de la llave.


38
2018-03-05 17:47



... este ejemplo evita el envío de formularios (regularmente la intención básica al capturar la pulsación de teclas n. ° 13):

$('input#search').keypress(function(e) {
  if (e.which == '13') {
     e.preventDefault();
     doSomethingWith(this.value);
   }
});

30
2018-05-12 22:58



 // in jquery source code...
 if (!event.which && ((event.charCode || event.charCode === 0) ? event.charCode : event.keyCode)) {
     event.which = event.charCode || event.keyCode;
 }

 // So you have just to use
 $('#searchbox input').bind('keypress', function(e) {
     if (e.which === 13) {
         alert('ENTER WAS PRESSED');
     }
 });

26
2018-05-07 15:35



editar: Esto solo funciona para IE ...

Me doy cuenta de que esta es una publicación antigua, pero a alguien le puede resultar útil.

Los eventos clave se asignan, por lo que, en lugar de usar el valor del código clave, también puede usar el valor clave para hacerlo un poco más legible.

$(document).ready( function() {
    $('#searchbox input').keydown(function(e)
    {
     setTimeout(function ()
     { 
       //rather than using keyup, you can use keydown to capture 
       //the input as it's being typed.
       //You may need to use a timeout in order to allow the input to be updated
     }, 5);
    }); 
    if(e.key == "Enter")
    {
       //Enter key was pressed, do stuff
    }else if(e.key == "Spacebar")
    {
       //Spacebar was pressed, do stuff
    }
});

Aquí hay una hoja de trucos con las teclas asignadas que obtuve de este Blog enter image description here


25
2018-01-08 01:27



Pagar el excelente plugin jquery.hotkeys que admite combinaciones de teclas:

$(document).bind('keydown', 'ctrl+c', fn);

20
2017-07-20 19:21



$(document).ready(function(){
    $("#btnSubmit").bind("click",function(){$('#'+'<%=btnUpload.ClientID %>').trigger("click");return false;});
    $("body, input, textarea").keypress(function(e){
        if(e.which==13) $("#btnSubmit").click();
    });
});

Espero que esto te ayude !!!


14
2018-02-17 11:18



De acuerdo, estaba ciego:

e.which

contendrá el código ASCII de la clave.

Ver https://developer.mozilla.org/En/DOM/Event.which


6
2017-11-19 15:01



Aquí hay una descripción en detalle del comportamiento de varios navegadores http://unixpapa.com/js/key.html


6
2018-03-05 17:41