Geek Answers Handbook

Select Element onChange doesn't shoot?

I have a select element with an onChange event that fires when I click on a select box and select a new value inside it. But, when I insert into the selection field and press the up or down arrows to change the value of the selection field, the event does not fire.

I am using jQuery().change(function(){ ... }); to set an event

+4
source share
4 answers

When you enter the <select> element, the change event does not fire until you press Enter.

+2
source

When onChange() triggered, the value must be changed, and input must be blur() -ed (focus moved elsewhere); therefore, it works in your first case, but not in the second.

A change event is dispatched to an element when its value changes. This event is limited to <input> , <textarea> and <select> elements. For select flags, check boxes, and radio buttons, the event is fired immediately when the user makes a selection with the mouse, but for other types of elements, the event is delayed until the element loses focus.

Link:

+1
source

As others noted, the change event does not occur before the blur event. You will also need to keep an eye on the keyboard to grab someone changing values ​​with the arrow keys.

Keyboard monitoring and change,

 $('select').bind('change keyup', function() { // Handle });

http://jsfiddle.net/robert/Je26w/

+1
source

You can fire the blur event on keyup on select , and then return focus , which will trigger the change:

 $('select').keyup(function(){ $(this).blur().focus(); });

example: http://jsfiddle.net/niklasvh/XEg36/

+1
source

More articles:


All Articles