change

Test page.

Events overview page.

The change event fires when a form field changes state.

change on text inputs
Fires when the user blurs the input AND the text has been changed since the last focus.
change on select boxes
Fires when the user activates a new option (either by a mouse click or by a keyboard activation).
change on checkboxes and radios
Fires when the user changes the element’s state (checked or not).
Test IE 5.5 IE 6 IE 7 IE8 IE9 IE10 pr2 FF 7.0 Win FF 6.1 Mac Saf 5.1 Win Saf 5.1 Mac Chrome 14 Win Chrome 13 Mac Opera 11.51 Win Opera 11.51 Mac
On the window
No Yes Yes Yes Yes Yes

Is this event available on the window?

On the document
No Yes Yes Yes Yes Yes

Is this event available on the document?

On a form
No Yes Yes Yes Yes Yes

Is this event available on a form?

On text inputs

The event should fire when the text input is blurred AND its contents have changed since the user focused on it.

Yes Yes Yes Yes Yes
Test IE 5.5 IE 6 IE 7 IE8 IE9 IE10 pr2 FF 7.0 Win FF 6.1 Mac Saf 5.1 Win Saf 5.1 Mac Chrome 14 Win Chrome 13 Mac Opera 11.51 Win Opera 11.51 Mac
On checkboxes and radios

The event should fire when the checkbox or radio is activated AND its checked property changes.

Buggy Yes Yes Yes Yes Yes

(The check property always changes when you click on a checkbox, but a click on a checked radio should not fire this event.)

  • IE 5-8 fires the event when the checkbox or radio is blurred, and not when it is activated. This is a serious bug that requires the user to take another action and prevents a consistent cross-browser interface based on the change event on checkboxes and radios.
On select boxes

The event should fire when the user has selected a new option (and not when the user goes through the list of options to decide which one he’s going to select).

Buggy Yes Yes Yes Buggy

When the user uses a mouse the click on the new option fires the event; when he uses a keyboard the event is fired when the select box is blurred.

  • When you focus on a select box and go through its options with the keyboard, IE and Opera fire the change event every time you select a new option. The other browsers fire the event only when you confirm the new option by leaving the select box.
On reset

When the user resets the entire form the event should fire on every element that changes.

No No No No No

Browsers generally disagree with my beautiful theory.

Event bubbling

The event should bubble.

Untestable Yes Yes Yes Yes Yes
Prevent default
“No” is the correct answer
Buggy No No No No No

The default action cannot be prevented.

  • When you try to prevent the default action in IE5/6 the focus gets stuck. In combination with the checkbox/radio bug this can cause weird results that end users will be unable to appreciate.
    The browser doesn't actually prevent the default.
Test IE 5.5 IE 6 IE 7 IE8 IE9 IE10 pr2 FF 7.0 Win FF 6.1 Mac Saf 5.1 Win Saf 5.1 Mac Chrome 14 Win Chrome 13 Mac Opera 11.51 Win Opera 11.51 Mac