jQuery keypress() with Examples

jQueryWeb DevelopmentFront End Technology

The keypress method in jQuery is used to trigger the keypress event. It occurs when a keyboard key is pressed down.

Syntax

The syntax is as follows −

$(selector).keypress(func)

Example

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

 Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
   count = 0;
   $(document).ready(function(){
      $("input").keypress(function(){
         $("span").text(count += 1);
      });
      $("input").keyup(function(){
         $("input").css("color", "blue");
      });
   });
</script>
</style>
</head>
<body>
<h2>Registeration</h2>
<p>Enter username of the student:</p>
Username: <input type="text"><br><br>
Key is pressed <span> 0 </span>times.
</body>
</html>

Output

This will produce the following output−

Now, when the key is pressed, the count of the number of keys appeared−

raja
Updated on 30-Dec-2019 08:01:17

Advertisements