How to handle ESC keydown on JavaScript popup window?

Javascript Web Development Front End Technology Object Oriented Programming

As we know the ESC has the keycode 27. If you will use the keycode 27, then you can handle the condition.

Example

Following is the code −

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
</head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet" />
<body>
</body>
<script>
   $(document).keydown(function (eventValue) {
      if (eventValue.keyCode == 27) {
         console.log("ESC key is pressed....");
      }
      else {
         console.log("Some other is key pressed....")
      }
   });
</script>
</html>

To run the above program, save the file name “anyName.html(index.html)”. Right click on the file and select the option “Open with Live Server” in VS Code editor.

Output

This will produce the following output −

Now I am going to press another button except the ESC key.

Output

This will produce the following output on console −

Now, I am going to press the ESC key. The console output will change −

AmitDiwan

Published on 09-Nov-2020 08:46:01

Previous Page Print Page