JS/JQuery 在 1 秒后重试图片加载

Question

我有一个请求，需要调用大量的图片，如下所示：

<a href='www.domain1.com'><img src='../image/img1.png' onerror='imgError(this);'/></a>
<a href='www.domain2.com'><img src='../image/img2.png' onerror='imgError(this);'/></a>

问题在于当调用时，部分图片（约20%）尚未准备好。它们需要再等待一秒钟。

因此，在js或jquery中，我想要做的是在出现错误时获取失败的图像，等待1秒钟，然后再次尝试加载这些失败的图像。如果第二次仍然失败——那没关系，我可以接受。但我没有正确地执行这个操作...我是否不应该在js中的另一个方法内调用超时？

function imgError(image) {
    image.onerror = "";
    image.src = image;

    setTimeout(function () {
        return true;
    }, 1000);
}

- Chris

---

你到底为什么想要这样做？除了实现中的问题外，我怀疑将 img.src 设置为它已经设置的内容不会产生任何效果。 - jfriend00

哈哈。嗯，实际上我在最初的ajax和加载图像之间使用了imagemajick。对于这样的情况，什么是更好的做法？顺便说一下，谢谢你的评论... - Chris

请查看这里的答案：https://dev59.com/fG855IYBdhLWcg3wiU71 - Samuel O'Malley

FYI，@SamuelO'Malley，尽管OP提到了AJAX，但我认为这里没有AJAX，也不需要有。 - Paul Draper

谢谢@PaulDraper，我不确定他是否真的想使用AJAX。 - Samuel O'Malley

非常抱歉表达不够清晰。感谢你们的帮助和修改。 - Chris

Answer 1

添加缓存破坏器。

function imgError(image) {
    image.onerror = null;
    setTimeout(function (){
        image.src += '?' + +new Date;
     }, 1000);
}

（这假设您的图像URL尚未具有查询字符串，例如。如果已经具有，则需要进行更多工作。）

- Paul Draper

---

搞定了。非常感谢 @Paul_Draper。 - Chris