Learn to Attach Event Handler with jQuery .change() Method

jQuery change: Main Tips

• The jQuery .change() method is a shortcut of using either the .on() or .trigger() method with change event as the first parameter.
• It attaches an onchange event handler to run when the jQuery change event occurs, or invokes said event.

Usage of .change() Explained

The .change() jQuery method attaches an event handler, invoked when the value of an input element (such as <input>, <textarea>, <select>) changes.

See the example below and enter anything in the field or check a checkbox. Clicking outside it will cause an alert to pop, telling you the input value has been changed:

$("input").change(() => {
    alert("Your input value has been changed.");
});

The syntax for jQuery .change() is as follows:

$(selector).change([eventData], handler)

jQuery .change() can also trigger the event itself. Follow this simple syntax for that:

$(selector).change()

As you can see, .change() jQuery method takes two arguments. The eventData is an object, which contains data passed to the event handler. The event handler is a callback function. Additionally, you can add a selector.