Load another image with JavaScript, when the original image has a broken link

I was creating a application for a customer, where we experienced a lot of problems with broken links to external images.

Instead of every second image would be the standard broken link image, that is different from every browser, we wanted to have a standard missing-image image. So I was looking for a good solution to handle the broken image link error, and this was what I found:

From: http://stackoverflow.com/questions/92720/jquery-javascript-to-replace-broken-images#answer-92819

Make this JavaScript function:

function imgError(image) {
    image.onerror = "";
    image.src = "/images/noimage.gif";
    return true;

And add this to the image:

<img src="image.png" onError="imgError(this);">

Or without a JavaScript function:

<img src="image.png" onError="this.onerror=null;this.src='/images/noimage.gif';">

This should do the job.


Martin Schadegg Rasch Jensen