未findsrc源图像时，如何隐藏“Image not found”图标
当图像文件没有find时，您知道如何从呈现的HTML页面隐藏经典的“图像未find”图标吗？
任何使用JavaScript / jQuery / CSS的工作方法？
您可以在JavaScript中使用onerror事件来处理图片无法加载的情况：
var img = document.getElementById("myImg"); img.onerror = function () { this.style.display = "none"; }
在jQuery中（因为你问）：
$("#myImg").error(function () { $(this).hide(); });
或者对于所有图像：
$("img").error(function () { $(this).hide(); // or $(this).css({visibility:"hidden"}); });
您应该使用visibility: hidden而不是.hide()如果隐藏图像可能会更改布局。 Web上的许多站点都使用默认的“无图像”图像，而当指定的图像位置不可用时，将src属性指向该图像。
<img onerror='this.style.display = "none"'>
对Andy E的答案做一个快速的研究，它不可能live()绑定error 。
// won't work (chrome 5) $('img').live('error', function(){ $(this).css('visibility', 'hidden'); });
所以你必须去
$('<img/>', { src: 'http://www.notarget.com/fake.jpg', error: function(e){ $(this).css('visibility', 'hidden'); } }).appendTo(document.body);
直接绑定error event handler创build一个新的元素。
回答可能有点迟，但这是我的尝试。 当我遇到同样的问题，我通过使用图像大小的div和设置背景图像到这个div来解决它。 如果图像没有find，div就会变成透明的，所以它们都是静静地完成的，没有java脚本代码。
要隐藏每个图像错误，只需在页面底部添加此JavaScript（就在closures正文标记之前）：
(function() { var allimgs = document.images; for (var i = 0; i < allimgs.length; i++) { allimgs[i].onerror = function() { this.style.visibility = "hidden"; // Other elements aren't affected. } } })();
我稍微修改了Gary Willoughby提出的解决scheme，因为它简要地显示了破碎的图像。 我的解决scheme
<img src="..." style="display: none" onload="this.style.display=''">
在我的解决scheme中，图像最初是隐藏的，只有在成功加载时才显示。 它有缺点：用户不会看到半张图片。 如果用户禁用JS，那么他将永远不会看到任何图像
我已经find了一个漂亮的方法来做到这一点，而在Angular.js中使用ng-src指令时，仍然可以正常工作，像…
<img ng-src="{{myCtrl.myImageUrlThatWillDynamicallyChange}}" onerror="this.src='data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=='" />
它基本上是最短的透明GIF（如所见http://proger.i-forge.net/%D0%9A%D0%BE%D0%BC%D0%BF%D1%8C%D1%8E%D1%82% D0％B5％D1％80 / [20121112]％20The％20smallest％20transparent％20pixel.html ）
当然这个gif可以保存在一些全局variables中，所以不会搞乱模板。
<script> window.fallbackGif = "..." </script>
并使用
<img ng-src="{{myCtrl.myImageUrlThatWillDynamicallyChange}}" onerror="this.src=fallbackGif" />
等等
