如何检测损坏的图像并替换为另一个？

I have a page which displays lots of images from different remote servers. http://example.com/img/email_star0.png' height='150' />

Now suppose this image is not present, I get a (x) in my html. Is there anyway that I can detect that this image is not present and replace this (x) with a local image without having to check if the file exists on the remote server using Curl (or using JQuery for that matter) and thereby save time? Can this be done locally?

Thanks for your help

Yes this is possible using onerror event:

<img src="your_image_source" onerror="this.src='/path/to/local/file'">

If the image does not exist, instead of displaying the X, this will show the default image in your local folder

I don't think it is possible to check if image exists on remote server without using curl or jQuery. But jQuery snippet bellow reacts on image loading error by replacing it with a local one, maybe that's what you are looking for.

$(document).ready(function(){
  $('img').error(function(){
     $(this).attr('src', 'http://mysite/myimage.jpg');
  });
});

You can use the 'onerror' attribute directly in the image tag:

<img src="my_images.jpg" onerror="this.src='my_replacement.jpg'">