Javascript 检查是否存在带有url的图像在所有浏览器中都不起作用

嗨，伙计们，我需要在我的项目中显示一个循环中包含其他字段的图像，这样图像src在每次迭代中都会不同，我必须知道这个图像是否存在以生成默认src。如果不存在，我将向你们展示的代码只在Firefox上工作，而不在Chrome和IE中工作：

  var img = new Image();
    img.src = "www.Imagesource.com/Image.Jpeg";
     var imgcheck = img.width;    

if (imgcheck==0) {
  alert("You have a zero size image");
} else { 
  alert('You have a good img');
   //Do something
}

需要您的帮助。

处理图像错误事件

您需要将新创建的img附加到DOM元素，如

$("<img/>")
    .on("load", function() { alert('You have a good img'); })
    .on("error", function() { alert('You got error'); })
    .attr("src", "http://www.Imagesource.com/Image.Jpeg")
    .appendTo("body"); // append to body or any other element

有两个问题：

img.src=www.Imagesource.com/Image.Jpeg这是一个相对URL，但它显然是一个绝对URL。在其前面添加http://、https://，或仅添加//即可

您不允许检索图像的异步性。在正确设置src之前，钩住load和error事件。负载告诉你它起作用了。错误告诉你它没有。但是立即检查宽度不会告诉你任何事情，因为图像可能还没有加载

因此：

注意

在设置src之前，我们将挂接事件。这一点很重要，特别是当图像有可能在缓存中时

这两个事件都将异步发生

---

您可以做的是在出现错误时指定不同的图像。onerror=；或者在你的html中，比如img.src=www.Imagesource.com/Image.Jpeg，这是错误的。这是一个相对的URL，但它显然是一个绝对的URL。在它前面添加一个http://，https://，或者只是//而已。我尝试过这样做，问题是在img说它是否已加载或者是否有一个error@Omar对不起，我没听清楚？@Omar:什么是花束？谷歌说有一个圈或卷曲的帘布层的纱线，或是用这种纱线织成的织物，看起来…不相关。@Kiranvj我在我的线圈中做了这个代码，有一个问题，如果img负载或错误测试的结果完成了，线圈就不能等待，并且可以循环了。。。所以我不能在Loop的associate元素中显示image src对不起，我忘记了boucle==我习惯于说的Loopfrench@Omar：示例应代表实际用例。答案的一小部分是1。问题是事件是异步的，因为我必须把它们放在一个循环中，并用这个事件结果改变当前的迭代，。。你能解决吗？@Omar我想我现在明白你的问题了。您可能需要一个函数闭包来跟踪哪个图像与哪个链接：您可以通过单击右上角来查看代码。谢谢，我会将其放入托盘中

$("<img/>")
    .on("load", function() { alert('You have a good img'); })
    .on("error", function() { alert('You got error'); })
    .attr("src", "http://www.Imagesource.com/Image.Jpeg")
    .appendTo("body"); // append to body or any other element

var img = new Image();
img.onload = function() {
    // It loaded, check `width` if you think that's necessary
};
img.onerror = function() {
    // It failed to load
};
img.src = "http://www.Imagesource.com/Image.Jpeg";