jQuery keydown() Event

The jQuery keydown() event triggers when a key is pressed down on the selected element.

Syntax of keydown() event

$(selector).keydown(function) 

The selector is the element on which keydown event trigger. The function is an optional parameter. This function is called when user presses a key on the keyboard.

Example

<form>
<input type="text" value="Enter a key" id="keydwn" />
</form>	

<script>
(function( $ ) { 
$("#keydwn").keydown(function(){  
alert("The keydown event occurs.");  
});  
})(jQuery);
</script>

Output of the above code

In the above example, an alert message is displayed when the user pressed down a key on the input box.

Example

<form>
<p>Enter your name:</p> <input type="text" id="kydwn">  
</form>
<script>
$(document).ready(function(){  
$("input#kydwn").keydown(function(){ 
$("input#kydwn").css("background-color", "pink");
});  
});  
</script>

Output of the above code

In the above example, the background color of the input box is changed when the user pressed down a key on the input box.