Cómo evitar números mágicos al hacer coincidir un event.keyCode en javascript

Question

¿Puedo evitar los números mágicos al hacer coincidir las pulsaciones de teclas en JavaScript?

Un ejemplo sería usar 13 para que coincida con la tecla Intro .

Podría especificar mis propias constantes, pero no sé si estos valores son lo suficientemente estables en diferentes plataformas / navegadores / locales.

Answer 1

La primera vez que intenté hacer esto, usé el método charCodeAt de String. Por ejemplo, si desea detectar la presión de " a " clave:

if ("A".charCodeAt(0) == event.keyCode) {
  /* Do stuff here. */
}

Observe que utilicé la mayúscula " A " en lugar de " a " ;. Esto se debe a que event.keyCode solo se informa como el valor Unicode de la letra mayúscula (si es una clave alfa). Lo que hace que este problema sea un poco complicado es que hay varias formas de obtener el valor Unicode para la tecla que se presionó. En Firefox tienes:

• event.keyCode
• event.charCode
• evento.que

De acuerdo con la documentación del desarrollador de Mozilla, el valor Unicode de la clave se almacenará en event.keyCode o event.charCode , pero no ambos . Independientemente de cuál tenga el código, también se almacenará en event.which . Sin embargo, si el valor se almacena en charCode, será sensible a mayúsculas y minúsculas. Por lo tanto, dependiendo de dónde obtenga sus eventos, es posible que tenga que verificar ambos '' a '' y "A". Si tiene el lujo de obtener solo su evento clave del " onkeydown " evento, y está apuntando a Firefox, puede contar con obtener el código que distingue entre mayúsculas y minúsculas (mayúsculas) en event.keyCode De hecho, probé esto en Firefox 3.0.3 en Windows XP, Firefox 3.0.4 en MacOS 10.4, Safari 3.2.1 en MacOS 10.4 y OmniWeb 5.8 en MacOS 10.4, y todo funciona igual. Sin embargo, no he probado esto en ninguna de las versiones de IE, Opera, etc.

Si quieres desarrollar esto desde cero por tu cuenta. Sugeriría obtener tantos navegadores diferentes como pueda encontrar en tantos sistemas operativos diferentes como tenga acceso, y hacer algunos experimentos para descubrir cómo cada navegador informa los códigos clave. Sin embargo, alguien ya ha hecho ese trabajo. Incluso se mencionó en una de las respuestas a ¡La pregunta que vinculaste como ejemplo! Es un complemento para jQuery llamado js-hotkeys . Le permite registrar las funciones de devolución de llamada que se ejecutarán cuando se presione una tecla o una combinación de teclas. Un ejemplo de uso que he copiado del sitio del proyecto:

$(document).bind('keydown', 'Ctrl+a', fn);

Se ha probado que funciona en una variedad de navegadores / plataformas diferentes, por lo que si está utilizando jQuery, este es probablemente el camino a seguir. Si no quieres usar jQuery por alguna razón, no tienes suerte. Aparentemente, esto se basó en otro script que podría usar en su lugar. Todavía no he utilizado ninguna de estas bibliotecas personalmente, por lo que no puedo garantizar su facilidad de uso o eficacia. Dicho esto, si tuviera su problema, esa es la dirección que buscaría para resolverlo.