How to use JQuery Event keydown() Method
This article describe about jQuery Event keydown() Method.
jQuery Event keydown() Method
When you press any key form your keyboard then it's 2 part occur.
- The key is pressed down.
- The key is released.
When keyboard key is pressed then keydown event occur, keydown() method trigger the keydown event, or it also define a function to run when keydown event occurs.
Example
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("input").keydown(function () {
$("input").css("background-color", "Gray");
});
$("input").keyup(function () {
$("input").css("background-color", "yellow");
});
});
</script>
</head>
<body>
Ente name: <input type="text" />
<p>Enter your name in the input field. It will change background color on keydown and keyup.</p>
</body>
</html>
|
Output
Note: This is a output when "d" key pressed in the input field.
Trigger the keydown Event
For selected element trigger occur on keydown.
Example
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("input").keydown(function () {
$("input").css("background-color", "Gray");
});
$("input").keyup(function () {
$("input").css("background-color", "yellow");
});
$("#btn1").click(function () {
$("input").keydown();
});
$("#btn2").click(function () {
$("input").keyup();
});
});
</script>
</head>
<body>
Enter name: <input type="text" />
<p>Enter name in the input field. It will change background color on keydown and keyup.</p>
<p><button id="btn1">Activate keydown event for input field</button></p>
<p><button id="btn2">Activate keyup event for input field</button></p>
</body>
</html>
|
Output
Bind a Function to the keydown Event
Define a function to run when keydown event occur for selected element.
Syntax
$(selector).keydown(function)
|
You may also want to read these related articles Click here
Ask Your Question
Got a programming related question? You may want to post your question here
Programming Answers here