JavaScript控制图片加载完成后调用回调函数的方法


Posted in Javascript onMarch 20, 2015

本文实例讲述了JavaScript控制图片加载完成后调用回调函数的方法。分享给大家供大家参考。具体分析如下:

这段代码可以控制指定区域内的图片加载完成后执行指定的回调函数。

function when_images_loaded($img_container, callback) {

/* do callback when images in $img_container (jQuery object) are loaded. Only works when ALL images in $img_container are newly inserted images and this function is called immediately after images are inserted into the target. */

    var _imgs = $img_container.find('img'),

        img_length = _imgs.length,

        img_load_cntr = 0;

    if (img_length) {//if the $img_container contains new images.

        _imgs.on('load', function() {//then we avoid the callback until images are loaded

            img_load_cntr++;

            if (img_load_cntr == img_length) {

                callback();

            }

        });

    }

    else { //otherwise just do the main callback action if there's no images in $img_container.

        callback();

    }

}

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JQuery从头学起第三讲
Jul 06 Javascript
dojo学习第一天 Tab选项卡 实现
Aug 28 Javascript
jquery中prop()方法和attr()方法的区别浅析
Sep 06 Javascript
如何让浏览器支持jquery ajax load 前进、后退功能
Jun 12 Javascript
ECMAScript6轮播图实践知识总结
Aug 17 Javascript
js实现导航栏中英文切换效果
Jan 16 Javascript
Linux CentOS系统下安装node.js与express的方法
Apr 01 Javascript
关于webpack代码拆分的解析
Jul 20 Javascript
Web开发使用Angular实现用户密码强度判别的方法
Sep 27 Javascript
vue里面v-bind和Props 利用props绑定动态数据的方法
Aug 27 Javascript
详解vue-cli+element-ui树形表格(多级表格折腾小计)
Apr 17 Javascript
JQuery+drag.js上传图片并且实现图片拖曳
Nov 18 jQuery
jQuery UI插件自定义confirm确认框的方法
Mar 20 #Javascript
js使用split函数按照多个字符对字符串进行分割的方法
Mar 20 #Javascript
原生Js实现简易烟花爆炸效果的方法
Mar 20 #Javascript
Javascript调用函数方法的几种方式介绍
Mar 20 #Javascript
初识Node.js
Mar 20 #Javascript
JavaScript Sort 的一个错误用法示例
Mar 20 #Javascript
JS实现的数组全排列输出算法
Mar 19 #Javascript
You might like
php 删除无限级目录与文件代码共享
2008/11/22 PHP
PHP 一个随机字符串生成代码
2010/05/26 PHP
PHP 图片上传代码
2011/09/13 PHP
使用PHP接收POST数据,解析json数据
2013/06/28 PHP
php计算数组不为空元素个数的方法
2014/01/27 PHP
php使用socket post数据到其它web服务器的方法
2015/06/02 PHP
Laravel中Facade的加载过程与原理详解
2017/09/22 PHP
Javascript入门学习资料收集整理篇
2008/07/06 Javascript
ajax 文件上传应用简单实现
2009/03/03 Javascript
js中格式化日期时间型数据函数代码
2010/11/08 Javascript
javascript作用域容易记错的两个地方分析
2012/06/22 Javascript
模拟多级复选框效果的jquery代码
2013/08/13 Javascript
jQuery插件bxSlider实现响应式焦点图
2015/04/12 Javascript
jQuery基于ajax()使用serialize()提交form数据的方法
2015/12/08 Javascript
js控制TR的显示隐藏
2016/03/04 Javascript
浅谈JavaScript中的this指针和引用知识
2016/08/05 Javascript
jQuery居中元素scrollleft计算方法示例
2017/01/16 Javascript
微信小程序slider组件使用详解
2018/01/31 Javascript
vue.js移动数组位置,同时更新视图的方法
2018/03/08 Javascript
jQuery实现的简单获取索引功能示例
2018/06/04 jQuery
Vue实现远程获取路由与页面刷新导致404错误的解决
2019/01/31 Javascript
vue动态添加路由addRoutes之不能将动态路由存入缓存的解决
2019/02/19 Javascript
python操作日期和时间的方法
2014/03/11 Python
Python中的测试模块unittest和doctest的使用教程
2015/04/14 Python
Django实现图片文字同时提交的方法
2015/05/26 Python
python 快速把超大txt文件转存为csv的实例
2018/10/26 Python
Pytest单元测试框架如何实现参数化
2020/09/05 Python
使用html5+css3来实现slider切换效果告别javascript+css
2013/01/08 HTML / CSS
鼠标滚轮事件和Mac触控板双指事件
2019/12/23 HTML / CSS
运动会广播稿100字
2014/01/11 职场文书
学年末自我鉴定
2014/01/21 职场文书
读书活动总结范文
2014/04/26 职场文书
镇创先争优活动总结
2014/08/28 职场文书
党的群众路线个人对照检查材料
2014/09/23 职场文书
Nginx搭建rtmp直播服务器实现代码
2021/03/31 Servers
理解python中装饰器的作用
2021/07/21 Python