Valor de KeyboardEvent (keyCodes, metaKey, etc.) - Trucos CSS

Cuando se KeyboardEventdispara, puede probar qué tecla se presionó porque ese evento contiene información contra la que puede escribir lógica.

document.addEventListener("keydown", function(event) ( console.log(event.which); ))

Por ejemplo, al presionar "a", obtendrá 65. Aparentemente, es mejor escribir lógica contra la cual, como keyCode y charCode son complicados:

La propiedad event.which normaliza event.keyCode y event.charCode. Se recomienda ver event.which para la entrada de teclas del teclado.

Y:

En un evento de pulsación de tecla, el valor Unicode de la tecla pulsada se almacena en la propiedad keyCode o charCode, nunca en ambas. Si la tecla presionada genera un carácter (por ejemplo, 'a'), charCode se establece en el código de ese carácter, respetando el caso de la letra. (es decir, charCode tiene en cuenta si se mantiene presionada la tecla shift). De lo contrario, el código de la tecla presionada se almacena en keyCode.

Herramienta de prueba

Vea el probador de Pen event.keyCode de Chris Coyier (@chriscoyier) en CodePen.

Valores de código clave

Aquí hay una tabla que contiene los valores de event.which.

Llave Código retroceso 8 pestaña 9 ingresar 13 cambio dieciséis control 17 alt 18 pausa / descanso 19 Bloq Mayús 20 escapar 27 (espacio) 32 página arriba 33 Página abajo 34 fin 35 hogar 36 flecha izquierda 37 flecha arriba 38 flecha correcta 39 flecha hacia abajo 40 insertar 45 Eliminar 46 0 48 1 49 2 50 3 51 4 52 5 53 6 54 7 55 8 56 9 57 a sesenta y cinco B 66 C 67 D 68

Llave Código mi 69 F 70 gramo 71 h 72 I 73 j 74 k 75 l 76 metro 77 norte 78 o 79 pag 80 q 81 r 82 s 83 t 84 tu 85 v 86 w 87 X 88 y 89 z 90 tecla de la ventana izquierda 91 tecla de la ventana derecha 92 seleccionar clave 93 teclado numérico 0 96 numpad 1 97 teclado numérico 2 98 teclado numérico 3 99 teclado numérico 4 100 teclado numérico 5 101 teclado numérico 6 102 teclado numérico 7 103

Llave Código teclado numérico 8 104 teclado numérico 9 105 multiplicar 106 agregar 107 sustraer 109 punto decimal 110 dividir 111 f1 112 f2 113 f3 114 f4 115 f5 116 f6 117 f7 118 f8 119 f9 120 f10 121 f11 122 f12 123 Num lock 144 bloqueo de desplazamiento 145 punto y coma 186 signo igual 187 coma 188 pizca 189 período 190 barra inclinada 191 acento grave 192 soporte abierto 219 barra invertida 220 cierre braket 221 una frase 222

Zell Liew notó que 3 de estos códigos clave eran diferentes en Firefox que el resto de los navegadores

• ; es 59 en Firefox pero 186 en otros navegadores.
• = es 61 en Firefox pero 187 en otros navegadores.
• - es 173 en Firefox pero 189 en otros navegadores.

Nota importante: estos valores de código clave solo son válidos durante los eventos in keydowny keyup. En Mac, los keypresseventos le brindan un conjunto de códigos completamente diferente.

Por ejemplo:

Llave	event.which en keydown	event.which en pulsación de tecla
a	sesenta y cinco	97
B	66	98
C	67	99