keypress Event using JQUERY

When we press a key the keypress event occurs.
This event is triggered for printing keyes only ( excluding non-printing keys like Esc, Shift, arrow keys etc)

Here is the syntax

  • Video Tutorial on keyboard Events

Code to trigger keypress event .

$(document).ready(function() {

Difference between keypress and keydown events

The keypress() event is not triggered by the non-printing keys like Esc, Shift key , Delete key etc , whereas all keys are tracked by keydown() event.
keydown() event is case insensitive
keypress() event is case sensitive
DEMO of difference between keypress and keydown Events
$(document).ready(function() {
//// keydown() ///
$('#d1').html('Keydown Event happened, keycode: '+ event.which);
setTimeout(function() { $("#d1").fadeOut('slow'); }, 1000);
/////keypress() ///
$('#d2').html('Keypress Event happened, keycode: '+ event.which);
setTimeout(function() { $("#d2").fadeOut('slow'); }, 1000);
 <div id=d1></div> <div id=d2></div>
Event Reference Keydown() keyup()
DEMO of Hover on multiple elements
Mouse enter and mouse leave events Learn which key is pressed by user Application : Duration of holding the key


* indicates required
Subscribe to plus2net

    Post your comments , suggestion , error , requirements etc here .

    Most Popular JQuery Scripts


    Two dependant list boxes


    Calendar with Date Selection


    Data change by Slider


    Show & Hide element

    JQuery Video Tutorials

    We use cookies to improve your browsing experience. . Learn more
    HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
    ©2000-2024 All rights reserved worldwide Privacy Policy Disclaimer