jQuery Tutorial Tutorials - jQuery .keyup(handler) method

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

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

jQuery .keyup() method Syntax

.keyup()
.keyup(handler)
.keyup(eventData,handler)

jQuery .keyup() method Example

example

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

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

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

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

jQuery .keyup(handler) method Example

Note that when using keyup() method,the keyCode of A and a are the same. A=65 , a=65.

example

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

var event = $.Event("keyup");
// 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 .keyup() VS .keypress()

There are two differences between keyup() and keypress() in jQuery.

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

example

when using keyup(),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 keyup() 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 keyup event is fired.

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

Try now