I have the following image element that it's src does not exists. I want to use the jquery error function to detect if it has not loaded and replace the src with a generic image that I know exists. This works in chrome and firefox but on in IE. Why does this not 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>
Timing issue?
<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>
I ran into the same problem with ie and setting the img src to itself allowed enough time for ie to catch the image error
$(document).ready(function() {
$("#mainImage").error(function () {
$(this).attr("src", "generic.jpg");
})
.each(function() {
$(this).attr("src",$(this).attr("src"));
});
});
Try this
$(function () {
$("#main").bind('error abort', function () {
$(this).attr("src", "generic.jpg");
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.