jQuery keydown() with Examples

jQueryWeb DevelopmentFront End Technology

The keydown() method in jQuery is used to trigger the keydown event. It occurs when a keyboard key is pressed down (on its way down).

Syntax

The syntax is as follows −

$(selector).keydown(function)

Example

Let us now see an example to implement the jQuery keydown() method 

 Live Demo

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
   $(document).ready(function(){
      $("input").keydown(function(){
         $("input").css("color", "red");
      });
      $("input").keyup(function(){
         $("input").css("color", "blue");
      });
   });
</script>
</head>
<body>
<h2>Registeration</h2>
<p>Enter username of the student:</p>
Username: <input type="text">
</body>
</html>

Output

This will produce the following output −

Now, when a keyboard key is pressed down (on its way down), the text color change to red −

Now, when a keyboard key is released, the text color change to blue −

raja
Updated on 30-Dec-2019 09:34:51

Advertisements