Javascript 检查图像加载失败

在下面的代码中，我将图像标记附加到div。当图像加载完成（成功）后，我希望在更改页面之前运行其他函数

var $img = $("<img src='https://www.example.com/path' />").on('load', function() {
         console.log('img loaded');
         //do other stuff
         window.location = "otherpage.com";
         return true;
    });

    $(".imgContainer").append($img);

var$img=$（“”）。在（'load'，function（）上{
console.log（'img-loaded'）；
//做其他事情
window.location=“otherpage.com”；
返回true；
});
$（“.imgContainer”）。追加（$img）；

如果图像实际存在于提供的URL上，或者未被阻止，则此功能将非常有效。（在我的例子中，由于我的网络代理设置，在追加映像时，我遇到了

net:：ERR\u TUNNEL\u CONNECTION\u FAILED

错误。在其他网络上，它工作正常。）

我的问题是，如何测试.on（'load'）回调中的

404（未找到）

或

net:：ERR\u TUNNEL\u CONNECTION\u失败

错误

尝试检查回调中的

responseText、textStatus、req

参数，但显然，由于从未加载img，因此从未调用回调。CORS未启用

使用

on（'error'，handler）

捕捉404

var $img = $("<img src='https://www.example.com/path' />").on('load', function() {
     console.log('img loaded');

}).on('error', function(event){

      console.log('img failed to load');
      console.log(event)
})

var$img=$（“”）。在（'load'，function（）上{
console.log（'img-loaded'）；
}).on（'error'，函数（事件）{
log（'img未能加载'）；
console.log（事件）
})