javascript判断图片是否加载完成的方法推荐


Posted in Javascript onMay 13, 2016

load事件

<script type="text/javascript">
  $('img').onload = function() {
    //code
  }
</script>

优点:简单易用,不影响HTML代码。

缺点:只能指定一个元素,javascipt代码必须置于图片元素的下方

jquery方法

<script type="text/javascript">
$(function(){
  $('.pic1').each(function() {
    $(this).load(function(){
      $(this).fadeIn();
    });
  });
})
</script>

注意,不要在$(document).ready()里绑定load事件。

优点:可以批量绑定元素事件,并且不影响HTML代码内容

缺点:需要jquery库的支持,代码需要放置到需要操作元素的下方。

以上这篇javascript判断图片是否加载完成的方法推荐就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery实现随意改变div任意属性的名称和值(部分原生js实现)
May 28 Javascript
轻量级的原生js日历插件calendar.js使用指南
Apr 28 Javascript
基于JS如何实现类似QQ好友头像hover时显示资料卡的效果(推荐)
Jun 09 Javascript
AngularJS 过滤器的简单实例
Jul 27 Javascript
jQuery删除节点用法示例(remove方法)
Sep 08 Javascript
JavaScript对象创建模式实例汇总
Oct 03 Javascript
解析预加载显示图片艺术
Dec 05 Javascript
jQuery ajax动态生成table功能示例
Jun 14 jQuery
Angular2 组件交互实例详解
Aug 24 Javascript
微信小程序实现MUI数字输入框效果
Jan 31 Javascript
vue+moment实现倒计时效果
Aug 26 Javascript
vue.js实现简单的计算器功能
Feb 22 Javascript
jQuery Easyui 验证两次密码输入是否相等
May 13 #Javascript
浅析javascript异步执行函数导致的变量变化问题解决思路
May 13 #Javascript
Javascript基础之数组的使用
May 13 #Javascript
JS判断图片是否加载完成方法汇总(最新版)
May 13 #Javascript
BootStrap扔进Django里的方法详解
May 13 #Javascript
JavaScript重载函数实例剖析
May 13 #Javascript
JS加载iFrame出现空白问题的解决办法
May 13 #Javascript
You might like
PHP file_get_contents设置超时处理方法
2013/09/30 PHP
PHP实现抓取Google IP并自动修改hosts文件
2015/02/12 PHP
PHP 进度条函数的简单实例
2017/09/19 PHP
PHP fclose函数用法总结
2019/02/15 PHP
Laravel find in set排序实例
2019/10/09 PHP
tp5.1 框架查询表达式用法详解
2020/05/25 PHP
Javascript中的window.event.keyCode使用介绍
2011/04/26 Javascript
Node.js中HTTP模块与事件模块详解
2014/11/14 Javascript
使用JavaScript 编写简单计算器
2014/11/24 Javascript
js实现拖拽效果(构造函数)
2015/12/14 Javascript
jQuery设置Cookie及删除Cookie实例分析
2016/04/15 Javascript
JS集成fckeditor及判断内容是否为空的方法
2016/05/27 Javascript
火狐和ie下获取javascript 获取event的方法(推荐)
2016/11/26 Javascript
AngularJS使用ng-repeat和ng-if实现数据的删选显示效果示例【适用于表单数据的显示】
2016/12/13 Javascript
基于JavaScript实现的希尔排序算法分析
2017/04/14 Javascript
BootStrap 导航条实例代码
2017/05/18 Javascript
浅谈Vue.js应用的四种AJAX请求数据模式
2017/08/30 Javascript
详解express + mock让前后台并行开发
2018/06/06 Javascript
在vue项目中正确使用iconfont的方法
2018/09/28 Javascript
JS实现transform实现扇子效果
2020/01/17 Javascript
从Node.js事件触发器到Vue自定义事件的深入讲解
2020/06/26 Javascript
基于element-ui封装表单金额输入框的方法示例
2021/01/06 Javascript
Python学习笔记之os模块使用总结
2014/11/03 Python
Eclipse和PyDev搭建完美Python开发环境教程(Windows篇)
2016/11/16 Python
PyTorch实现ResNet50、ResNet101和ResNet152示例
2020/01/14 Python
python微信公众号开发简单流程实现
2020/03/09 Python
使用CSS3的ruby-position固定注音位置的用法示例
2016/07/05 HTML / CSS
中秋寄语大全
2014/04/11 职场文书
预备党员转正材料
2014/12/19 职场文书
2015年清明节活动总结
2015/02/09 职场文书
2015年团支书工作总结
2015/04/03 职场文书
大学考试作弊检讨书
2015/05/06 职场文书
员工规章制度范本
2015/08/07 职场文书
送给教师们,到底该如何写好教学反思?
2019/07/02 职场文书
关于战胜挫折的名言警句大全!
2019/07/05 职场文书
关于党风廉政建设宣传教育月的活动总结!
2019/08/08 职场文书