Internet Explorer 7 and blur (with input type=file)

Today I noticed an interesting issue with IE 7 and the blur event, when using the <input type=”file”> HTML widget. A friend called me to tell me that their web app is validating the form fields, when the user is pressing the native “Browse…” button. But only in IE 7 (well, I don’t have IE6 installed). Interesting…

A simple test case for that:

<form>
  <input id="file" type="file"
    onblur="alert('blur');"
    onchange="alert('file');" />
  <br/><br/>
  <button>Blah</button>
</form>

And indeed! In IE 7, the alert(‘blur’) is visible, when you hit the “Browse…” button. FF works fine. Please note that the widget was not focused before. Very annoying…But, as almost always there is a way around that😉 This little jQuery-based hack helps to get rid of it (in the particular use case…):

<script>
$(document).ready(function(){
 $("#file").removeAttr("onblur");
});
</script>

Not a clean generic solution, but I think it does its job…

I personally haven’t noticed this bug before, but I am sure it is “known” since ages😉

Howdy!

Posted in javascript, jQuery
One comment on “Internet Explorer 7 and blur (with input type=file)
  1. matthiaswessendorf says:

    A friend told me that IE 6 has the same bug…

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: