Change event is never triggered if another element is programmatically focused

[scottgonzalez]

If the value of a text field is changed and then focus is programmatically moved to another element, the native change event is triggered, but any event handlers bound via jQuery will not be triggered.

​http://jsbin.com/elazu4/5/edit

[scottgonzalez]

This is the cause of ​http://bugs.jqueryui.com/ticket/6918

[Rick Waldron]

Scott, I'm adding this to show that change is fired when the input receives focus again:

​http://jsbin.com/elazu4/7/

[dmethvin]

OK, here's a bare-DOM example showing the order events are fired:

​http://jsbin.com/elazu4/8/edit

I think what is happening here is jQuery.event.trigger sets a jQuery.event.triggered flag just before calling the native DOM <a>.focus() method. The browser fires the blur and change events DURING that process, which normally would be handled but are blocked because the flag is checked in eventHandle:

​https://github.com/jquery/jquery/blob/master/src/event.js#L402

​https://github.com/jquery/jquery/blob/master/src/event.js#L85

It works properly if you start the process by using DOM <a>.focus() which calls the jQuery.event.handle directly, rather than $("a").focus() which calls jQuery.event.trigger. This appears to have been the way events were handled for several years afaict.

[Rick Waldron]

#8169 is a duplicate of this ticket.

[masklinn]

Replying to dmethvin:

It works properly if you start the process by using DOM <a>.focus() which calls the jQuery.event.handle directly, rather than $("a").focus() which calls jQuery.event.trigger. This appears to have been the way events were handled for several years afaict.

The exact same issue can be seen by using .blur() on the node itself rather than .focus() on an other node: $(this).blur() will fail to trigger onchange() but this.blur() will correctly trigger it.

[dmethvin]

Fixed in 1.5.2.