Javascript jQuery预加载程序ie-6/7问题

我在index.html页面上运行了这个jQuery预加载脚本，在重定向到其他页面之前加载了大约10Mb

它在IE8/9 FF3+和Chrome中工作良好。 但它在IE6/7中似乎不起作用，它似乎启动并运行，但从未启动最后一部分

工作示例：-已删除-

有人知道为什么它会卡在ie6/7中加载的75/76文件上吗

<script src="js/jquery-1.7.1.min.js"></script>
<script>
    (function($) {
var imgList = [];
$.extend({
    preload: function(imgArr, option) {
        var setting = $.extend({
            init: function(loaded, total) {},
            loaded: function(img, loaded, total) {},
            loaded_all: function(loaded, total) {}
        }, option);
        var total = imgArr.length;
        var loaded = 0;

        setting.init(0, total);
        for (i = 0; i < imgArr.length; i++) {
            imgList.push($("<img />")
                .load(function() {
                    loaded++;
                    setting.loaded(this, loaded, total);
                    if(loaded == total) {
                        setting.loaded_all(loaded, total);
                    }
                })
                .attr("src", imgArr[i])
            );
        }
    }
});
})(jQuery);

$(function() {
$.preload([
"http://www.erikderuiter.nl/images/300x300-transparent.png",
"http://www.erikderuiter.nl/images/300x300.png",
"http://www.erikderuiter.nl/images/300x600.png",
"http://www.erikderuiter.nl/images/600x300.png",
"http://www.erikderuiter.nl/images/600x600.png",
"http://www.erikderuiter.nl/images/900x300.png",
], {
    init: function(loaded, total) {
        $("#indicator").html("Files: "+loaded+"/"+total);
    },
    loaded: function(img, loaded, total) {
        $("#indicator").html("Files: "+loaded+"/"+total);
        $("#full-screen").append(img);
    },
    loaded_all: function(loaded, total) {
        $("#indicator").html("Loading: Done!");
        window.location.replace("http://www.erikderuiter.nl/somepage.html");
    }
});
});
</script>

<div id="indicator"></div>

（函数（$）{
var-imgList=[]；
$扩展({
预加载：功能（imgArr，选项）{
var设置=$.extend({
init:函数（已加载，总计）{}，
已加载：函数（img，loaded，total）{}，
loaded_all:函数（loaded，total）{
}，选择权）；
var total=imgArr.length；
var=0；
设置.init（0，总计）；
对于（i=0；i

---

当然，我们也欢迎在页面上预加载图像的任何其他提示或最佳做法。

您还需要测试图像是否已缓存

var img = new Image();
img.src = "foo.jpg";
if (img.complete || img.readyState === 4) {
    // image is cached
}
else {
    $(img).bind("load error onreadystatechange",function(e){
        // image is loaded
    });
}

如果其中一个图像上出现404错误，则需要使用

setTimeout

和

cleartimout

捕捉该错误

编辑：在我因使用

.bind

而受到抨击之前，请注意：为了向后兼容，我仍然在插件中使用

.bind

以下是上述方法的一个示例：

---

再次编辑：再读一遍后，我不确定缓存是否是您目前遇到的问题。如果您不检查它，肯定会在以后出现问题，但可能与您遇到的问题无关。

您还需要测试图像是否已缓存

var img = new Image();
img.src = "foo.jpg";
if (img.complete || img.readyState === 4) {
    // image is cached
}
else {
    $(img).bind("load error onreadystatechange",function(e){
        // image is loaded
    });
}

如果其中一个图像上出现404错误，则需要使用

setTimeout

和

cleartimout

捕捉该错误

编辑：在我因使用

.bind

而受到抨击之前，请注意：为了向后兼容，我仍然在插件中使用

.bind

以下是上述方法的一个示例：

---

再次编辑：再读一遍后，我不确定缓存是否是您目前遇到的问题。如果您不检查缓存，它肯定会在以后出现，但可能与您遇到的问题无关。

您的数组中有一个额外的逗号，我假设这是一个打字错误，因为IE8可能会出现在这方面失败了。是的，数组长得多。在这个例子中缩短了它。你的数组中有一个额外的逗号，我假设这是一个问题，因为IE8在这方面会失败。是的，数组长得多。在这个例子中缩短了它。即使我清除了整个浏览器，所以没有缓存，ie6/7仍然会失败。所有图像我n该数组已经存在，并且可以在其他浏览器中加载。我将研究您的示例。希望我可以使用它。这是您在JSFIDLE中的代码，用于测试，从photobucket加载100个图形。它似乎在IE7中工作，只需片刻就可以完成最后一个。谢谢，但我不熟悉json或YahooAPI。这只是一个示例作为静态图像数组的替代，应该不会有任何区别，因为这只是我们正在预加载的图像列表。我要说的是，你的插件在IE7 8和IE7 9中为我工作。即使我清除了整个浏览器，因此没有缓存，ie6/7仍然会失败。数组中的所有图像都存在，并且可以在其他浏览器中加载。我会看看我的这是你在JSFIDLE中用于测试的代码，从photobucket加载100个图形。它似乎在IE7中工作，只需要一点时间就可以完成最后一个。谢谢你，但我不熟悉json或YahooAPI。它只是静态图像数组的替代品，应该不会有任何区别这只是我们正在预加载的图像列表。我想说的是，你的插件在IE7 8和IE9中为我工作。