jQuery Tutorial Tutorials - jQuery .keypress(handler) method

The .keypress() method in jQuery is used to bind an event handler to the keypress event on the elements.

The .keypress() method is also used to trigger the keypress event on an element.

jQuery .keypress() method Syntax

.keypress()
.keypress(handler)
.keypress(eventData,handler)

jQuery .keypress() method Example

example

Use .keypress() without an argument to trigger a keypress event on element.
HTML

<form>
    <input id="target" type="text" value="Hello there">
</form>
<div id="other">
    Trigger the handler
</div>

$( "#target" ).keypress(function() {
    console.log( "Handler for .keypress() called." );
});

$( "#other" ).click(function() {
    $( "#target" ).keypress(); // trigger the event
});

jQuery .keypress(handler) method Example

example

To trigger the keypress event specified by key code,you should use trigger() method.

var event = $.Event("keypress");
// e.keyCode= 13; // the enter key code
event.which = 49; // Character '1'
event.keyCode = 49;
event.key = 1;
$("input[name=username]").trigger(event);

Try now

jQuery .keydown() VS .keypress()

There are two differences between keydown() and keypress() in jQuery

In older verion,keydown keeps firing if the key is kept pressed, while keypress and keyup fire only once.

example

when using keydown(),it's case insensitive,the keyCode of A and a are the same. A=65 , a=65.
keypress() is case sensitive,the keyCode of A and a are: A=65 , a=97.

The difference between keydown() and keypress() when capturing the keyCode and which

Try now

example

When user press the special key such as Shift, Esc, and delete,only the keydown event is fired.

The difference between keydown() and keypress() when processing special key.

Try now