Syntax error HTML DOM KeyboardEvent keyCode Property

HTML DOM KeyboardEvent keyCode Property



The KeyboardEvent keyCode property returns the unicode character codes corresponding to character that was pressed using an event.

Note − Use key property instead for accurate results

Syntax

Following is the syntax −

Returning latest typed character’s keyCode −

event.keyCode

Example

Let us see an example for KeyboardEvent keyCode property −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<title>KeyboardEvent keyCode</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>KeyboardEvent-keyCode</legend>
<label>Fill in the blanks:
<input type="text" id="textSelect" placeholder="__ for Mango" onkeypress="getEventData(event)" autocomplete="off">
</label>
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var textSelect = document.getElementById("textSelect");
   function getEventData(InputEvent) {
   if(InputEvent.keyCode === 109)
      divDisplay.textContent = 'Correct Answer';
   else
      divDisplay.textContent = 'Try Again, '+textSelect.placeholder;
   textSelect.textContent = '';
}
</script>
</body>
</html>

Output

This will produce the following output −

Before typing anything in the text field −

After typing wrong answer in the text field −

After typing correct answer in the text field −

Updated on: 2019-07-30T22:30:26+05:30

82 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements