jQuery change event placed on file input inconsistent between Firefox & IE

[wbharding]

I recently upgraded to jQuery 1.4 from 1.2.x and have found that the following code, which previously worked across all browsers, no longer works seamlessly in Internet Explorer:

<form id="myform">

<input type="file">

</form>

...

$('#myform input).change(function() { alert("Someone picked a file") });

...

In Firefox, this code continues to work like it did prior to 1.4, namely, as soon as the user picks a file, the change event fires. But in IE 7 (the only IE I've tested it in) the change event no longer fires, unless/until I click inside the browser window after choosing my file. I'm guessing it has something to do with the event not firing until something (not sure what... maybe the page itself?) gets focus.

Expected behavior would be for the change event to fire immediately in IE after a file has been chosen, just as it does in FF, and it did in jQuery prior to 1.4.

[john]

Hmm, I'll have to check in to this - not sure if this is something that we tested for in the new change implementation.

[john]

I landed a temporary fix for this: ​http://github.com/jquery/jquery/commit/467063a2e25bae25adfa2e9ab789c62e241c9c56

There definitely needs to be more investigation here - the file input control behaves in a very non-traditional manner, it's not entirely clear what event(s) get triggered when it's interacted with.

[jitter]

#7544 is a duplicate of this ticket.

Adapted ​test case from #7544 also some info there about IE7/8 FF 4

[Rick Waldron]

#7766 is a duplicate of this ticket.

[merge]

​http://jsfiddle.net/YRuaX/1/ (bind) - work properly in ie8
​http://jsfiddle.net/YRuaX/2/ (live) - doesn't work properly in ie8

[dmethvin]

The native change event doesn't bubble in IE, but we use heroic efforts to bubble a fake-change event for other input types. We aren't able to do that here which means it cannot be used in a .live() binding.

If anyone can determine a way to create a bubbled change event in IE6/7/8 please contact us and we can discuss whether the fix could be incorporated into jQuery core.

[addyosmani]

I've recently documented this here: ​http://api.jquery.com/live/

[[email protected]…]

I have documented that here ​http://alexturpin.net/jquery.html

And this SO answer seems to be the key to make it work:

​http://stackoverflow.com/questions/2389341/jquery-change-event-to-input-file-on-ie/2876677#2876677