Javascript：捕获所有OnError

我看到了一个代码，当加载图像时出现404错误时，会显示一个默认图像

大概是这样的：

<img src="img/article_1744408190.jpg" onerror="this.src = 'ImgAlt.jpg'">

---

但它必须从每个图像调用

onerror

函数。但是，我如何实现一种方法，通过Javascript（或JQuery）捕获所有OneError触发器，并单独将图像SRC设置为

default.jpg

。发布示例代码将非常有用。要做到这一点，您需要钩住

error

事件，然后返回并检查图像是否已经出错（挂接事件之前）来处理它们。大致如下：

var defaultImage = "ImgAlt.jpg";
$("img").one("error", function() {
    this.src = defaultImage;
}).each(function() {
    if (this.complete && !this.naturalWidth) {
        this.src = defaultImage;
        $(this).off("error");
    }
});

当图像被破坏时，

complete

将为

true

。

naturalWidth

将为图像的自然宽度，如果图像被破坏，则为

0

或

undefined

。遗憾的是，后一项检查几乎是知道图像被破坏的唯一方法，因为任何（显然是盲目需要的）事件后的错误指示器。（

naturalWidth

以及IE9-IE11；真正过时的IE8不支持它。）

---

---

请注意，假设您要加载的图像实际上都不是零宽度。这似乎是一个安全的假设：-

您可以在

窗口
（）上设置错误事件侦听器，并检查目标是否为图像，如果是，请更改其
src
：

window.addEventListener("error", function(e) {              // when an error happens
    if(e.target.tagName.toLowerCase() === "img") {          // if the target is an image
        e.target.src = "default.jpg";                       // then change its src to whatever you want
    }
}, true);


window.addEventListener（“错误”，函数（e）{
如果（例如：target.tagName.toLowerCase（）=“img”）{
e、 target.src=”http://via.placeholder.com/200/ff0000/000000?text=404";
}
}，对）

是啊！发布一个示例代码对我们也很有用！除了在所有图像上手动添加
onerror
属性外，您如何尝试解决此问题？有关如何使用
alt
属性的详细信息：我知道的唯一方法是使用s并添加
fetch
事件侦听器。在构建步骤中添加
onerror
处理程序要简单得多，然后才能实际执行此操作。全局错误处理程序是否确实为
img
标记启动？@BenjaminGruenbaum yes您能解释一下我在小提琴中遗漏了什么吗？看起来此解决方案不起作用。@ibrahimmahrir-是否在任何地方指定和/或记录了此解决方案？它在移动浏览器中工作吗？（顺便说一句，via.placeholder.com这个东西真的很酷！）@ibrahimmahrir-：-）很多人认为MDN是“官方文档”，但事实并非如此，你可以稍微关注一下，因为它不是官方的（只是社区编辑的，非常好）。它通常链接到源代码，但本例中的链接似乎并没有说明它是以上面的方式工作的。令人沮丧。：-）您可能希望添加一个委托处理程序来处理动态添加的图像，否则这相当简单，而且可以工作。@BenjaminGruenbaum-
错误
不会冒泡，即使规范中说应该是这样。：-）jQuery文档中有一个警告。请注意，假设您要加载的图像实际上没有一个是零宽度的-这不是一个安全的假设，因为大多数像素代码都使用
img
标记来加载pixel@Vivek-那些是1像素宽，当然不是0？您甚至可以创建任何标准格式的0宽度图像吗？@T.J.Crowder像素不是实际图像，它们只是api调用（对于ex
&；noscript=1“height=“0”width=“0”style=“display:none“/>
，在这种情况下，如果调用失败，它将触发
错误
事件，并且
默认图像
将加载，如果我错了，请纠正我。