keyCodePropiedad de evento

事件对象参考手册Objeto de evento

Ejemplo

Obtener el valor Unicode de la tecla presionada:

var x = event.keyCode;

xEl resultado de salida es:

119 // 119 es el carácter "w"

Pruébalo »

Este artículo contiene más ejemplos al final.


Definición y uso

La propiedad keyCode devuelveonkeypressel código de carácter del valor de la tecla que disparó el evento, oonkeydownoonkeyupel código de la tecla del evento.

La diferencia entre los dos tipos de código es:

  • Código de carácter: un número que representa un carácter ASCII
  • Código de teclado: un número que representa la tecla real en el teclado

Los valores de los dos tipos no siempre son iguales. Por ejemplo, el carácter minúscula "w" y el carácter mayúscula "W" tienen el mismo código de teclado, porque están en la misma tecla (el código de "W" es "87"), pero tienen diferentes códigos de carácter; la salida de los dos caracteres es diferente (los códigos de carácter de "w" y "W" son "119" y "87"). Consulta los siguientes ejemplos para entenderlo mejor.

Consejo:Si necesitas saber si el usuario presionó una tecla de impresión (como "a" o "5"), se recomienda usar el evento onkeypress. Si necesitas saber si el usuario presionó una tecla de función (como "F1", "CAPS LOCK" o "Home"), puedes usar los eventos onkeydown u onkeyup.

Nota:En Firefox, la propiedad keyCode no es válida (devuelve 0) en el evento onkeypress. Para problemas de compatibilidad con navegadores, se puede usar junto conwhichy la propiedad keyCode para resolverlo:

var x = event.which || event.keyCode; // usawhichokeyCode, esto es compatible con diferentes navegadores.

Consejo:Toda la lista de caracteres Unicode se puede consultar en nuestromanual de referencia completo de Unicode。

Consejo:Si necesitas convertir un valor Unicode a un carácter, puedes usarfromCharCode()método.

Nota:Esta propiedad es de solo lectura.

Nota:Las propiedades which y keyCode proporcionan una forma de resolver la compatibilidad del navegador. Las versiones más recientes de los eventos DOM recomiendan usarkeyla propiedad para reemplazar este método.

Consejo:Si quieres ver si se ha presionado la tecla "ALT", "CTRL", "META" o "SHIFT", puedes usaraltKey, ctrlKey, metaKeyoshiftKeyla propiedad.


Soporte del navegador

Propiedad
keyCode Yes Yes Yes Yes Yes


Sintaxis

event.keyCode

Detalles técnicos

Valor devuelto: Número que representa el código de carácter Unicode o el código de tecla Unicode
Versión DOM: DOM Level 2 Events


实例

Más ejemplos

Ejemplo

Usa onkeypress y onkeydown para demostrar la diferencia entre el código de carácter y el código de teclado:

<input type="text" onkeypress="uniCharCode(event)" onkeydown="uniKeyCode(event)">

function uniCharCode(event) {
    var char = event.which || event.keyCode;
    document.getElementById("demo").innerHTML = "Unicode CHARACTER code: " + char;
}

function uniKeyCode(event) {
    var key = event.keyCode;
    document.getElementById("demo2").innerHTML = "Unicode KEY code: " + key;
}

Cuando se presiona la tecla "a" en el teclado (sin Bloq Mayús), el resultado de salida es:

Código de carácter Unicode: 97
Código de tecla Unicode: 65

Pruébalo »

Ejemplo

Si se presiona la tecla Esc, muestra un mensaje emergente:

<input type="text" onkeydown="myFunction(event)">

function myFunction(event) {
    var x = event.keyCode;
    if (x == 27) {  // 27 es la tecla ESC
        alert ("You pressed the Escape key!");
    }
}

Pruébalo »

Ejemplo

Convierte el valor Unicode a un carácter (no se puede usar para teclas de función):

var x = event.keyCode;                // Obtener el valor Unicode
var y = String.fromCharCode(x);       // Convertir el valor a carácter

Pruébalo »


Páginas relacionadas

Manual de referencia de HTML DOM:key Propiedad de evento

Manual de referencia de HTML DOM:keyCode Propiedad de evento

Manual de referencia de HTML DOM:which Propiedad de evento

事件对象参考手册Objeto de evento

Otras extensiones