1

代码示例：

var img = $("img");
var n = img.length;
var i = 0;
function loadImg(i) {
    if( i < n ) {
        $(img[i]).load( function() {
            console.log("img["+i+"] loaded");
            i++;
            loadImg(i);
        });
    } else {
        console.log("img["+i+"] loaded");
        return false;
    }
}
loadImg(0);

此代码有效，但是当图像已经在浏览器缓存中时 - jQuery.load 没有触发。如何检查图片是否在浏览器缓存中并强制触发 jQuery.load？

谢谢。

4

2 回答 2

2

Paul Irish 为此编写了一个简洁的小插件。它完全符合您的要求，包括从缓存加载的图像：

https://github.com/paulirish/jquery.imgloaded

我已经用包含的上述插件更新了你的小提琴。这应该回答你的问题：

http://jsbin.com/acuhaf/9/edit

于 2013-03-12T14:52:12.360 回答
1

jQuery 文档说：

与图像一起使用时加载事件的注意事项
开发人员尝试使用 .load() 快捷方式解决的一个常见挑战是在图像（或图像集合）完全加载时执行一个函数。

应该注意几个已知的警告。
它们是：
- 它不能始终如一地工作，也不能可靠地跨浏览器
- 如果图像 src 设置为与以前相同的 src，它不会在 WebKit 中正确触发
- 它不会正确地冒泡 DOM 树
-可以停止触发已经存在于浏览器缓存中的图像

您可能想使用其他库来预加载图像。我会推荐PreloadJS

于 2013-03-12T14:52:58.253 回答