jQuery change() Event

The jQuery change event triggers on change some values on the selected element. This is limited to form elements only, like - select, input, textarea elements.

Syntax of change() event

$(selector).change(function)

The selector is the element on which change event trigger. The function is an optional parameter and called when the change event occurs.

Example

<form>
<select class="selectoption">
<option value="option1" selected="selected">Item 1 </option>
<option value="option2">Item 2</option>
</select>
</form>

<script>
(function( $ ) { 
$(".selectoption").change(function(){  
alert("You have changed option.");  
});  
})(jQuery);
</script>

Output of the above code

In the above example, on change select option, it alerts message.

Example

<form>
Enter Address <input type="text" id="txt" />
<p id="validadrs"></p>
</form>

<script>
(function( $ ) {
$("input[type='text']").change(function(){  
$("p#validadrs").html("Please enter valid full address.");
});  
})(jQuery);  
</script>

Output of the above code

In the above example, after entering the text in the input field and click outside, it shows the message.