JQuery () error function not working in IE

Question

I have the following image element that src does not exist. I want to use the jquery error function to determine if it is loaded and replace src with a common image that I know exists. This works in chrome and firefox, but in IE. Why doesn't this work in IE and are there any workarounds? Thanks!

<img id="main" src="missing-image.jpg" /> <script type="text/javascript"> $(function () { $("#main").error(function () { $("#main").attr("src", "generic.jpg"); }); }); </script> 

Answer 1

Dates:

DEMO HERE

 <img id="mainImage" src="placeholder.jpg" /> <script type="text/javascript"> $(document).ready(function() { $("#mainImage").error(function () { $(this).attr("src", "generic.jpg"); }); $("#mainImage").attr("src","possibly_missing_image.jpg"); }); </script> 

Answer 2

I ran into the same problem with ie, and installing img src alone allowed enough time to catch the image error

 $(document).ready(function() { $("#mainImage").error(function () { $(this).attr("src", "generic.jpg"); }) .each(function() { $(this).attr("src",$(this).attr("src")); }); }); 

Answer 3

try it

 $(function () { $("#main").bind('error abort', function () { $(this).attr("src", "generic.jpg"); }); });