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
<p>
Focus the IFrame first (e.g. by clicking in it), then try pressing some keys.
</p>
<p id="log"></p>
const log = document.getElementById("log");
document.addEventListener("keyup", logKey);
function logKey(e) {
log.textContent += ` ${e.code}`;
}
onkeyup equivalent
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):
eventTarget.addEventListener("keyup", (event) => {
if (event.isComposing || event.keyCode === 229) {
return;
}
// do something
});