如果在预设的时间内未完成加载，是否可以重新加载特定图像？ javascript/jquery

我正在运行一个在线摄影作品，有时候，1或2张图片无法加载。刷新将显示加载失败的图像。如果在预设的时间内未完成加载，是否可以重新加载特定图像？ javascript/jquery

场景：我点击链接，图像开始加载。但页面从未完成加载，因为其中一个图像加载失败。刷新后，浏览器将失败的图像加载为良好的图像。只有ctrl + F5可以清除缓存的失败图像。

计划解决方案：我想要检测到10secs后未完成加载并使用javascript/jquery动态重新加载它们的图像。

我找到了一种方法来强制浏览器通过在src =“image.jpg？id = dummyNo”后面添加一个虚拟唯一查询字符串来重新加载图像。但我不知道如何检测哪个图像没有完成加载，以便我可以重新加载它们。

可以做到这一点吗？

在旁注中，我想了解网站压缩和图像（加载时间）优化，哪里会是我阅读的好地方？

来源

2010-05-27 IsenGrim

我想你的时候会更好地用试图找出什么地方错了你的主机。对于实际存在于服务器上的图像，出于神秘原因而不加载的情况并不常见。（另外，** 10秒？！？**） – Pointy 2010-05-27 16:19:10

由于@Pointy提到，您的服务器/主机存在严重问题..将它带给他们并要求他们修复它.. – 2010-05-27 16:24:36

@Pointy和@Gaby在他们的评论中是正确的。尽管如此，我还是很好奇。

这就是我想出它的价值所在。但未经测试。

var images = $('img'); // Get all images. (you'll want to modify the selector 
         // to work with only the desired images) 

images.load(function() {  // Add a load event hander that removes 
    images = images.not(this); // each image from images once loaded. 
}); 

setTimeout(function(){  // After 10 seconds, iterate over each remaining 
    images.each(function() { //  image, reloading each one 
     // reload this image 
    }); 
},10000); // run after 10 seconds

来源

2010-05-27 16:32:23 user113716

非常好的解决方案。您可能会考虑使用setInterval而不是setTimeout，并且如果图像列表是空集，处理程序将取消定时器。这样你就可以适应第二次尝试不成功的情况。 – 2013-10-02 00:05:55

把下面的代码在页面的结尾：

$('img').error(function(){ 
    var src= $(this).attr('src'); 
    if (window.console) { 
     console.log('reload image '+ src); 
    } 
    int i= src.indexOf("&random="); 
    if(i > -1) { 
    src= src.substring(0,i); 
    } 
    i = src.indexOf("?random="); 
    if(i > -1) { 
    src= src.substring(0,i); 
    } 
    if(src.indexOf('?') > -1) { 
     src= src+"&random="+ (new Date().getTime()); 
    } else { 
     src= src+"?random="+ (new Date().getTime()); 
    } 
    $(this).attr('src', src); 
});

来源

2014-06-24 17:00:33 searching9x

如果在预设的时间内未完成加载，是否可以重新加载特定图像？ javascript/jquery

回答

相关问题