图片加载完成再执行事件的实例


Posted in Javascript onNovember 16, 2017

实例如下:

//图片加载
function load(imgSrc,callback) {
 var imgs = [];
 var c = 0;
 for (var i = 0; i < imgSrc.length; i++) {
  imgs[i] = new Image();
  imgs[i].src = imgSrc[i];
  imgs[i].onload = function(){
   c++
   if(c == imgSrc.length){
    if(callback){
     callback();
    }
   }
  }
 }
 return imgs;
}

应用场景:一些图片较多的页面,一些需要加上进度条或者百分比读取等加载效果的页面,一般移动端页面用得比较多

以上这篇图片加载完成再执行事件的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js注意img图片的onerror事件的分析
Jan 01 Javascript
让图片旋转任意角度及JQuery插件使用介绍
Mar 20 Javascript
同时使用n个window onload加载实例介绍
Apr 25 Javascript
jQuery实现跟随鼠标运动图层效果的方法
Feb 02 Javascript
js实现仿百度风云榜可重复多次调用的TAB切换选项卡效果
Aug 31 Javascript
在Ubuntu系统上安装Node.JS的教程
Oct 15 Javascript
jQuery实现进度条效果代码
Dec 17 Javascript
jquery使用on绑定a标签无效 只能用live解决
Jun 02 Javascript
JavaScript实现JSON合并操作示例【递归深度合并】
Sep 07 Javascript
Angular Material Icon使用详解
Nov 07 Javascript
vue中音频wavesurfer.js的使用方法
Feb 20 Vue.js
vue实现公告栏文字上下滚动效果的示例代码
Jun 16 Javascript
详解React 在服务端渲染的实现
Nov 16 #Javascript
Angular 5.0 来了! 有这些大变化
Nov 15 #Javascript
详解React Native 采用Fetch方式发送跨域POST请求
Nov 15 #Javascript
bootstrap 通过加减按钮实现输入框组功能
Nov 15 #Javascript
layui框架中layer父子页面交互的方法分析
Nov 15 #Javascript
layer实现关闭弹出层刷新父界面功能详解
Nov 15 #Javascript
layui.js实现的表单验证功能示例
Nov 15 #Javascript
You might like
php获取后台Job管理的实现代码
2011/06/10 PHP
如何用php获取文件名后缀
2013/06/09 PHP
PHP取整函数:ceil,floor,round,intval的区别详细解析
2013/08/31 PHP
不用ajax实现点击文字即可编辑的方法
2007/12/16 Javascript
JavaScript 事件对象的实现
2009/07/13 Javascript
js中的数组Array定义与sort方法使用示例
2013/08/29 Javascript
js中top的作用深入剖析
2014/03/04 Javascript
javascript 中that的含义示例介绍
2014/05/14 Javascript
js遍历子节点子元素附属性及方法
2014/08/19 Javascript
jQuery老黄历完整实现方法
2015/01/16 Javascript
JQuery中attr方法和removeAttr方法用法实例
2015/05/18 Javascript
Bootstrap入门书籍之(四)菜单、按钮及导航
2016/02/17 Javascript
基于javascript实现最简单的选项卡切换效果
2016/05/16 Javascript
javascript实现滚动效果的数字时钟实例
2016/07/21 Javascript
ros::spin() 和 ros::spinOnce()函数的区别及详解
2016/10/01 Javascript
js鼠标按键事件和键盘按键事件用法实例汇总
2016/10/03 Javascript
jQuery Validate插件自定义验证规则的方法
2016/12/27 Javascript
Bootstrap超大屏幕的实现代码
2017/03/22 Javascript
nodejs使用express创建一个简单web应用
2017/03/31 NodeJs
Vue的移动端多图上传插件vue-easy-uploader的示例代码
2017/11/27 Javascript
解决vuecli3.0热更新失效的问题
2018/09/19 Javascript
vue里的data要用return返回的原因浅析
2019/05/28 Javascript
基于element-ui封装表单金额输入框的方法示例
2021/01/06 Javascript
[02:01]大师之路——DOTA2完美大师赛11月论剑上海
2017/11/06 DOTA
Django中密码的加密、验密、解密操作
2019/12/19 Python
.dcm格式文件软件读取及python处理详解
2020/01/16 Python
Python-jenkins 获取job构建信息方式
2020/05/12 Python
pycharm设置默认的UTF-8编码模式的方法详解
2020/06/01 Python
python 利用matplotlib在3D空间绘制二次抛物面的案例
2021/02/06 Python
Ellos丹麦:时尚和服装在线
2016/09/19 全球购物
省级优秀班集体申报材料
2014/05/25 职场文书
民主评议党员登记表自我评价
2014/10/20 职场文书
对外汉语教师推荐信
2015/03/27 职场文书
统计员岗位职责范本
2015/04/14 职场文书
pytorch损失反向传播后梯度为none的问题
2021/05/12 Python
如何利用golang运用mysql数据库
2022/03/13 Golang