jq监听图片加载结束

本文介绍了如何利用jQuery实现异步监听页面中图片加载结束的技巧,详细讲解了定义和调用方法。
摘要由CSDN通过智能技术生成

jq异步监听页面图片加载结束
1、定义:

// 参数:如要监听的doc数据
function imgLoad(data) {
    return new Promise(function (res, err) {
        var imgData = data?data:$('img'); // 图片数据
        var img = [],
            flag = 0, // 成功加载的图片数量
            imgTotal = imgData.length, // 图片总数量
            mulitImg = []; // 商品图片路径
        // 循环等待页面里的所有图片都加载完成后再处理
        for (var i = 0; i < imgTotal; i++) {
            mulitImg.push(imgData.eq(i).attr('src'));
            img[i] = new Image();
            img[i].src = mulitImg[i];
            img[i].onload = function () {
                // 单张图片加载成功
                flag++;
                if (flag == imgTotal) {
                    //全部加载完成
                    res(200)
                }
            };
            var imgErrNum = 0; // 图片加载失败记录
            img[i].onerror = function (err) {
                // 单张图片加载失败
                imgTotal--;
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值