如果你正在使用Angular/jQuery，那么这可能会有帮助……

<img ng-src="{{item.url}}" altSrc="{{item.alt_url}}" onerror="this.src = $(this).attr('altSrc')">

解释

假设该项目有一个属性url可能为空，当它是，那么图像将显示为破碎。这将触发onerror属性表达式的执行，如上所述。你需要像上面描述的那样重写src属性，但是你需要jQuery来访问你的altSrc。无法让它与普通JavaScript一起工作。

可能看起来有点俗气，但挽救了我的项目。

谷歌抛出了这个页面的“图像回退html”关键字，但因为上面没有帮助我，我正在寻找一个“svg回退支持IE低于9”，我继续搜索，这是我发现的:

<img src="base-image.svg" alt="picture" />
<!--[if (lte IE 8)|(!IE)]><image src="fallback-image.png" alt="picture" /><![endif]-->

这可能离题了，但它解决了我自己的问题，也可能帮助到其他人。

简单利落的解决方案，包括一些好的答案和评论。

<img src="foo.jpg" onerror="this.src='error.jpg';this.onerror='';">

它甚至解决了无限循环风险。

为我工作。

如果你已经创建了动态Web项目，并将所需的图像放置在WebContent中，那么你可以通过使用下面提到的Spring MVC中的代码来访问图像:

<img src="Refresh.png" alt="Refresh" height="50" width="50">

你也可以创建名为img的文件夹，并将图像放在img文件夹中，然后将img文件夹放在WebContent中，然后你可以使用下面提到的代码访问图像:

<img src="img/Refresh.png" alt="Refresh" height="50" width="50">

使用Jquery，你可以这样做:

$(document).ready(function() {
    if ($("img").attr("src") != null)
    {
       if ($("img").attr("src").toString() == "")
       {
            $("img").attr("src", "images/default.jpg");
       }
    }
    else
    {
        $("img").attr("src", "images/default.jpg");
    }
});

只有HTML的解决方案，其中唯一的要求是你知道你插入的图像的大小。将不工作于透明图像，因为它使用背景图像作为填充。

我们可以成功地使用background-image来链接给定图像缺失时出现的图像。然后唯一的问题是破碎的图标图像-我们可以通过插入一个非常大的空字符来删除它，从而将内容推到img的显示之外。

img { 背景图片:url(“http://placehold.it/200x200”); 溢出:隐藏; ｝ img:{之前 内容:“”; 字体大小:1000 px; ｝ 这张图片缺失了: <img src="a.jpg" style="width: 200px;身高:200 px " / > < br / > 并且正在显示占位符

只有CSS的解决方案(只有Webkit)

img:{之前 内容:“”; 字体大小:1000 px; 背景图片:url(“http://placehold.it/200x200”); 显示:块; 宽度:200 px; 身高:200 px; 位置:相对; z - index: 0; margin-bottom: -16 px; ｝ 这张照片就在那里: < img src = " http://placehold.it/100x100 " / > < br / > 这张图片缺失了: < img src = " a.jpg " / > < br / > 并且正在显示占位符