Document: keyup event

O evento keyup é acionado quando a tecla é liberada.

Bubbles Sim
Cancelável Sim
Interface KeyboardEvent
Event handler propriedade onkeyup

Os eventos keydown e keyup fornecem um código indicando quando a tecla é pressionada, enquanto o keypress indica quando um character é inserido. Por exemplo, a letra minúscula "a", sera reportado como 65 por keydown e keyup, mas é 95 por keypress. Uma letra maiúscula é reportado como 65 por todos os eventos.

Nota: Se você está procurando por uma maneira de reagir a mudanças no valor de um input, você deve usar o input event. Algumas mudanças não são detectaveis por keyup, por exemplo, colar um texto de um contexto no input de texto.

Exemplos

Este exemplo registra o valor KeyboardEvent.code sempre que soltar a tecla.

addEventListener keyup exemplo

html
<p>
  Focus the IFrame first (e.g. by clicking in it), then try pressing some keys.
</p>
<p id="log"></p>
js
const log = document.getElementById("log");

document.addEventListener("keyup", logKey);

function logKey(e) {
  log.textContent += ` ${e.code}`;
}

onkeyup equivalent

js
document.onkeyup = logKey;

Ignorando o keyup durante IME composition

é Input Method Editor (IME) é um programa que permite usuários inserir caracteres que não são suportados pelo teclado usando alguma outra combinação de tecla.

Desde Firefox 65, os eventos keydown e keyup agora são disparados durante IME composition, para melhorar a compatibildiade cross-browser para usuários CJKT Erro do Firefox 354358. Para ignorar todos eventos keyup que são partes do composition, faça algo como isso (229 é um valor especial definido para o keyCode relacionando a um evento que sera processado no IME):

js
eventTarget.addEventListener("keyup", (event) => {
  if (event.isComposing || event.keyCode === 229) {
    return;
  }
  // do something
});

Especificações

{{Specifications}}

Compatibilidade de browser

{{Compat}}

Veja também