jQuery change | How to use change event of jQuery on form elements

jQuery change event

In HTML form elements, when the value of an element like textbox, dropdown, text area etc. is changed the change event occurs. jQuery provides change() method to perform some action or attach an event handler to change event.

Following is the syntax and example of using change event of jQuery.

Syntax of the change method

This is how you may use the change jQuery method:

$(selector).change(function)

e.g.

$(“txtbox”).change(function)

Where the function is optional, to be executed as change event happens.

Note that change event only works with form’s elements. For text boxes/areas it occurs when the focus is changed to another element after any change.

Note: In a case of the select / dropdowns, the change event occurs when an option is selected.

Running example of textbox change event

In below example as you enter some text into text box namely, Enter text, and then press Tab key from keyboard to move to next text field, the jQuery change event will happen and change method will be used to display an alert.

jQuery change method

Experience this example online

Example with select change