Javascript- Onkeypress Event Handler

The Onkeypress event handler in Javascript is an event handler that is triggred when a user presses down a key on the keyboard and the corresponding character is typed.

It is similar to the onkeydown() event handler except that it is triggered after the corresponding character is typed in after a user presses a key. The onkeydown() event handler occurs when a user presses a key down (without the corresponding character being typed in).

The onkeypress() event handler occurs between the onkeydown() event handler and the onkeyup() event handler.

This web element can be any element where a user can enter a character into, such as a form element, such as a textbox or a text area.

If one of these elements has an onkeypress() event handler and a key is pressed press on a keyboard and entered in, the function will be triggered and will do whatever it is programmed to do.

An example of the onkeypress event handler is shown below with the text box.

Click on this text box and press press any key on the keyboard.

Enter Your Name:

Once a key is pressed and entered into the text box, an alert pop-up box will then appear telling the user to "You Pressed a Key".

Code

The code to create the above text box which triggers the alert pop-up box is:

Enter Your Name: <input type="text" onkeypress="alert('You Pressed a Key');"/>

To create a text box that creates an alert pop-up when a key is pressed, we add an onkeypress() event handler to the text box. The onkeypress event handler triggers the alert, "You Pressed a Key".

Note: The onkeypress event handler cannot be used with HTML elements where you cannot enter a key into, such as <div></div> tags or <body></body> tags. It must be an element where a key can be entered into such as a textbox or text area.

Related Resources

HTML Comment Box is loading comments...

Learning about Electronics

Javascript- Onkeypress Event Handler

Code