VOOZH about

URL: https://www.geeksforgeeks.org/html/html-dom-keyboardevent/

⇱ HTML | DOM KeyboardEvent - GeeksforGeeks


  • Courses
  • Tutorials
  • Interview Prep

HTML | DOM KeyboardEvent

Last Updated : 8 Nov, 2022

It refers to the events which occur when a key is pressed on the keyboard. 

Syntax:

<input type="text" onkeypress/onkeydown/onkeyup="function()/event">

Events:The following events occur on pressing a key-

  • onkeydown
  • onkeypress
  • onkeyup

Properties:

  • altKey: It returns if alt key was pressed or not.
  • charCode: It returns unicode character of the key.
  • code: It returns the code of the entered key.
  • ctrlKey: It returns if ctrl key was pressed or not.
  • getModifierState(): It returns true if the specified key is activated.
  • isComposing: It returns whether the event is composing or not.
  • key: It returns the key value.
  • keyCode: It returns unicode character of the onkeypress or onkey down event.
  • location: It returns the location of the key on the keyboard.
  • metaKey: It returns if meta key was pressed or not.
  • repeat: It returns if a key is repeatedly holding on.
  • shiftKey: It returns if shift key was pressed or not.
  • which: It returns the unicode character of event type.

Return Value: It returns events which occur when a given key is pressed from the keyboard. 

Example-1: Showing onkeypress event. 

Output: 

Before Pressing a key:

 👁 Image
 

After Pressing a key:

 👁 Image
 

👁 Image
 

Example-2: Showing onkeydown event. 

Output: 

Before Pressing a key:

 👁 Image
 

After Pressing a key: 

👁 Image
 

👁 Image
 

Example-3: To check if the pressed key is Alt or not. 

Output: 

Before Pressing a key:

 👁 Image
 

After Pressing a key:

 👁 Image
👁 Image
 

Example-4: To find out the pressed key from the keyboard. 

Output: 

Before Pressing a key:

 👁 Image
 

After Pressing a key:

 👁 Image
 

Browser Support: The listed browsers support DOM Keyboard Event-

  • Google Chrome 1
  • Mozilla Firefox 1.5
  • Internet Explorer 9
  • Edge 12
  • Safari 1.2
  • Opera 12.1
Comment
Article Tags: