How to use change() Method in jQuery
This article describe about change() Method in jQuery.
jQuery Event change() Method
It is only work on the text fields, text areas and selected elements. This event occur when the value of an element is changed.
The change() specifies a function to run when a change event occurs.
Note: In the drop down menu change event occurs when an option is selected for text fields or text areas, and also change event occurs when the field loses focus.
Example
|
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".field").change(function () {
$(this).css("background-color", "yellow");
});
});
</script>
</head>
<body>
<p>When a field has been changed, it will change background color.</p>
Enter name: <input class="field" type="text" />
<p>bike:
<select class="field" name="bike">
<option value="honda">honda</option>
<option value="bajaj">bajaj</option>
<option value="hero">hero</option>
<option value="rajdoot">rajdoot</option>
</select>
</p>
</body>
</html>
|
Output
Trigger the change Event
For selected element trigger generate.
|
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("input").change(function () {
$(this).css("background-color", "yellow");
});
$("button").click(function () {
$("input").change();
});
});
</script>
</head>
<body>
<button>Change event trigger for input field</button>
<p>Enter name: <input type="text" /></p>
</body>
</html>
|
Output
Bind a Function to the change Event
It is specifies the function to run when change event occur.
Syntax
|
$(selector).change(function)
|
| Parameter |
Description |
| function |
Optional. It specifies the function run when change event occur. |
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