您的位置:首页 > Web前端 > JQuery

jquery判断图片加载完毕

2016-07-12 16:47 495 查看
单个图片加载
function loadImage(url, load, error)
{
var img = new Image(); //创建一个Image对象,实现图片的预下载
img.src = url;
if(img.complete)//如果图片已经存在于浏览器缓存,直接调用回调函数
{
load.call(img, img.width, img.height);
return; // 直接返回,不用再处理onload事件
}
img.onload = function () {
load && load.call(img);//将回调函数的this替换为Image对象
};
img.onerror = function () {
error && error.call(img);
img = img.onload = img.onerror = null;
};
};

下面是针对多个image的加载判断。

关于Deferred的应用,参见这篇文章:
http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html
var imgdefereds=[];
$('img').each(function(){
var dfd=$.Deferred();
$(this).bind('load',function(){
dfd.resolve();
}).bind('error',function(){
//图片加载错误,加入错误处理
// dfd.resolve();
})
if(this.complete) setTimeout(function(){
dfd.resolve();
},1000);
imgdefereds.push(dfd);
})
$.when.apply(null,imgdefereds).done(function(){
callback();
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: