如何检测破碎的图像并用另一个替换？ [英] How to detect broken image and replace with another?

问题描述

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

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

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

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

推荐答案

是的，这可以使用onerror事件：

Yes this is possible using onerror event:

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

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

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

这篇关于如何检测破碎的图像并用另一个替换？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！