W3cubDocs

/Web APIs

GlobalEventHandlers.onkeydown

The onkeydown property of the GlobalEventHandlers mixin is an event handler that processes keydown events.

The keydown event fires when the user presses a keyboard key.

Syntax

target.onkeydown = functionRef;

Value

functionRef is a function name or a function expression. The function receives a KeyboardEvent object as its sole argument.

Example

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

HTML

<input>
<p id="log"></p>

JavaScript

const input = document.querySelector('input');
const log = document.getElementById('log');

input.onkeydown = logKey;

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

Result

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
onkeydown
1
12
9
4
≤12.1
1
1
18
9
≤12.1
1
1.0

Compatibility notes

Since Firefox 65, the keyup and keydown events are now fired during IME composition, to improve cross-browser compatibility for CJKT users (bug 354358. To ignore all keydown events that are part of composition, do something like this (229 is a special value set for a keyCode relating to an event that has been processed by an IME):

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

See also

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onkeydown