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

Question

我有一个页面，显示来自不同远程服务器的大量图像。 http://example.com/img/email_star0.png'height ='150'/＆gt;

现在假设这个图像不存在，我的html中有一个（x）。无论如何我可以检测到这个图像不存在并用本地图像替换这个（x）而不必使用Curl检查文件是否存在于远程服务器上（或者使用JQuery），从而节省时间？这可以在当地完成吗？

感谢您的帮助

Answer 1

是的，可以使用onerror事件：

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

如果图像不存在，则会显示本地文件夹中的默认图像，而不是显示X

Answer 2

我不认为可以在不使用curl或jQuery的情况下检查远程服务器上是否存在图像。但是jQuery片段下面会对图像加载错误做出反应，将其替换为本地错误，也许这就是你要找的东西。

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

Answer 3

您可以直接在图片代码中使用'onerror'属性：

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