Syntax

Use the event name in methods like addEventListener(), or set an event handler property.

addEventListener("keyup", (event) => { })
onkeyup = (event) => { }

Event type

A KeyboardEvent. Inherits from UIEvent and Event.

Examples

addEventListener keyup example

This example logs the KeyboardEvent.code value whenever you release a key inside the <input> element.

<input placeholder="Click here, then press and release a key." size="40" />
<p id="log"></p>

const input = document.querySelector("input");
const log = document.getElementById("log");
input.addEventListener("keyup", logKey);
function logKey(e) {
  log.textContent += ` ${e.code}`;
}

keyup events with IME

Since Firefox 65, the keydown and keyup events are now fired during Input method editor composition, to improve cross-browser compatibility for CJKT users (Firefox bug 354358). To ignore all keyup events that are part of composition, do something like this:

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

Note: Unlike keydown, keyup events do not have special keyCode values for IME events. However, like keydown, compositionstart may fire after keyup when typing the first character that opens up the IME, and compositionend may fire before keyup when typing the last character that closes the IME. In these cases, isComposing is false even when the event is part of composition.

Specifications

Browser compatibility

See also

• input
• keydown
• keypress