Visualizador de teclas e eventos JavaScript

Pressione uma tecla: event.key, event.code, keyCode, modificadores, IME e ponteiro.

Events are read only while this field has focus. Turn blocking off to type into it (for IME tests).

Tab and Shift+Tab always move focus, and nothing is blocked while an input method (IME) is composing.

Last keydown

Press a key

JavaScript for this shortcut

Match by

Follows the user's layout: right for shortcuts named after a letter or symbol (Ctrl+Z, ?).

—

Event history

Events appear here as you type in the field.

O que faz

Clique no campo de captura e pressione teclas: para cada keydown você vê event.key, event.code, keyCode e which (obsoletos), location, os modificadores, a repetição, a composição de IME e o Caps Lock. Um histórico registra keydown, keyup, keypress, composition e beforeinput, e a ferramenta gera um manipulador JavaScript para a combinação pressionada. Outra aba examina eventos de mouse, roda, toque e ponteiro.

key, code e keyCode

key é o que a tecla produz com o layout atual ("a", "?", "Enter"); code é a tecla física pela posição no QWERTY americano ("KeyA"); keyCode e which são obsoletos e valem 229 durante a composição de um IME. Use key para atalhos com nome de caractere e code para posições, como WASD em jogos.

Sem prender o teclado

O bloqueio de atalhos só age enquanto o campo tem o foco, pode ser desligado, e Tab e Shift+Tab nunca são bloqueados. Nada é bloqueado durante a composição de um IME. Algumas combinações, como Alt+Tab, nunca chegam à página.

Perguntas frequentes

Qual a diferença entre event.key e event.code?

key é o caractere produzido com o layout atual; code é a posição física da tecla.

Devo usar keyCode?

Não, está obsoleto e seus valores variam entre navegadores e layouts.

Por que meu atalho dispara ao digitar com um IME?

Porque o manipulador não verifica event.isComposing; saia cedo quando for true.