如何捕获 iframe 内的 img 标记返回的 404(未找到)错误

How to capture 404 (not found) error returned by an img tag which is inside an iframe

本文关键字:错误 返回 iframe 何捕获 内的 img      更新时间:2023-09-26

考虑我有一个带有src的iframe标签。iframe src 属于同一域。没有跨域。

如果 iframe 文档具有返回"未找到"错误的图像标记。我应该如何在我的页面上的javascript中捕获此错误。我正在尝试这样做。但是控制台中除了图像错误之外什么都没有。

document.body.onload=function(){
     if(document.getElementById('myiframe')){
     var y = document.getElementById('myiframe').contentWindow ||     document.getElementById('myiframe').contentDocument;
     var z= y.document.getElementsByTagName('img');
     for(var i=0; i<z.length; i++){
     console.log(z[i]);
     z[i].onerror= function(){
        console.log('here');
      }
     }
    }
   }

可以使用 Image Complete 属性来测试它是否已加载:

if(document.getElementById("myImg").complete){
    alert("Image is loaded correctly !!!");
} else  alert("An error occured while loading Image !!!");

或者可以使用 new Image() 构造函数及其onerror()方法:

var image = new Image();
image.onerror = function () {
   console.error("Cannot load image");
   //do something else...
}
image.src = "path/image.jpg";

这是原始答案。

您可以在 iframe 中捕获图像失败,并从 iframe 调用父级的一个函数

$('img').error(function(){parent.imageNotLoaded()})