Skip to content

Keyboard events

New Courses Coming Soon

Join the waiting lists

Discover the basics of working with keyboard events in JavaScript

There are 3 types of events when interacting with keyboard events:

keydown is also fired when the key repeats while the button stays pressed.

While mouse and touch events are typically listened on a specific element, it’s common to listen for keyboard events on the document:

document.addEventListener('keydown', (event) => {
  // key pressed

The parameter passed to the event listener is a KeyboardEvent.

This event object, in addition to the Event object properties offers us (among others) these unique properties:

This demo is a keylogger which will show you the values of some of the properties I listed above:

→ Read my DOM Tutorial on The Valley of Code
→ Read my Browser Events Tutorial on The Valley of Code
→ Read my Browser APIs Tutorials on The Valley of Code

Here is how can I help you: