blog post

jQuery comes with three keyboard events to capture the keyboard activities – keyup(), keydown() and keypress().

  1. keyup() – Fire when user releases a key on the keyboard.
  2. keydown() – Fire when user presses a key on the keyboard.
  3. keypress() – Fire when user presses a key on the keyboard.


    • In general statement, the keydown() is similar to keypress() events. Actually there are quite few differential between keydown() and keypress() events.
      <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
      <body>
      <h1>jQuery keyup(), keydown() and keypress() example</h1>
      
      <label>TextBox : </label>
      <input id="textbox" type="text" size="50" />
      
      <div>
      <label>1. keyup() Message :</label> <span id="msg-keyup"></span>
      </div>
      
      <div>
      <label>2. keydown() Message :</label><span id="msg-keydown"></span>
      </div>
      
      <div>
      <label>3. keypress() Message :</label><span id="msg-keypress"></span>
      </div>
      
      <script type="text/javascript">
      
      $('#textbox').keyup(function(event){
      	$('#msg-keyup').html('keyup() is triggered!, keyCode = ' 
                    + event.keyCode + ' which = ' + event.which)
      });
      
      $('#textbox').keydown(function(event){
      	$('#msg-keydown').html('keydown() is triggered!, keyCode = ' 
                    + event.keyCode + ' which = ' + event.which)
      });
      
      $('#textbox').keypress(function(event){
      	$('#msg-keypress').html('keypress() is triggered!, keyCode = ' 
                    + event.keyCode + ' which = ' + event.which)
      });
      
      </script>
      </body>
      

jQuery keyboard events
  • Share This Story


Pleas give your valuable comments to improve the contents.

about author

Atul kumar shukla


I'm Atul Kumar Shukla, working as a web developer.
Welcome to my Blog. This is my personal blog where i post my own questions and answers , articles about ASP.Net., SQL Server, HTML, CSS, Jquery and many more..

Visit Profile

Leave a comment

Name
E-mail
Url
Message

Get More Stuff
Subscribing to the TheOneblogs newsletter and get intersting stuff and updates to your email inbox.
Your Email

 

Style Switcher

Change Color

×! We use cookies to improve your user experience. More information