jQuery load()事件未触发的IE9问题 [英] IE9 problems with jQuery load() event not firing

问题描述

我正在尝试预加载几张图像，并希望我的页面在所有图像加载完毕之前保持原状.所以我正在做的是这样:

I am trying to preload a couple of images and would like my page to go on hold until all of the images are loaded. So what I am doing is this:

var numPics = $('#bg img').length;
var picsLoaded = 0;
$('#bg img').load(function(){
    picsLoaded++;
    if (picsLoaded == numPics){
        buildPage();
    }

});

这在除(您猜对了)IE之外的所有浏览器中均能正常工作. Internet Explorer会以某种方式下载所有图片(我可以看到它们已在dev-tools中加载)，但是只会随机触发load -Event(每次刷新都会给我一个新的数字，通常它最多可以统计到大约一半的图像.我尝试了不同版本的jQuery(最初是从1.6.1开始的)，并且在此网站上也阅读了有关此类问题的信息，但找不到任何答案.

This works fine in all browsers except (you guessed it) IE. Somehow the Internet Explorer will download all pictures (I can see them being loaded in the dev-tools), but will only randomly fire the load-Event (each refresh will give me an new number, usually it will count up to about half of the images. I tried different versions of jQuery (I initially started with 1.6.1) and have also read about problems like this on this site but could not find any answer yet.

这似乎也不是与缓存相关的问题，因为清除它(或将随机查询字符串附加到图像源)没有任何作用.

Also it does not seem to be a cache related problem as busting it (or appending a random querystring to the image source) did not make a difference.

推荐答案

尝试重新分配图像源以触发事件:

Try to re-assign the image source in order to trigger the event:

var numPics = $('#bg img').length;
var picsLoaded = 0;
$('#bg img').each(function(index) {
    var img = $(this);
    img.load(function(){
        picsLoaded++;
        if (picsLoaded == numPics){
            buildPage();
        }
    });
    img.attr("src", img.attr("src"));
});

这篇关于jQuery load()事件未触发的IE9问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！