js判断图片是否加载成功
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> *{margin:;padding:;} .main{width:800px;margin:50px auto;border:1px solid #ccc;} .main li{%;} .main ul{overflow:hidden;} .main li img{width:%;} li{list-style: none;} </style> <script src="src.js"></script> </head> <body> <div class="main"> <ul> <li> <img src="https://img13.360buyimg.com/mobilecms/s80x80_jfs/t3607/53/1645824653/56317/14fbe587/582eb3d7N41fdab12.jpg!q90.webp" onload="imgObj('https://img14.360buyimg.com/n4/s130x130_jfs/t3358/84/1745747532/247590/ebbfc20e/58340651N16910ec9.jpg!q90.webp')"> </li> </ul> </div> </body> </html>
function imgObj(src){ var _src = src+'?datetime='+new Date().getTime(); /** * 加载图片,直到加载完成后才调用回调函数 * @param url 后面读取图片流的url * @param callback 回调函数 */ function loadImage(url, callback) { var img = new Image(); img.src = url; var timer = setInterval(function() { if (img.complete) { callback(img); clearInterval(timer); } }, ); } /** *图片加载完成 */ function testFun(_ele){ console.log('into testFun'); } loadImage(_src,testFun); }
js判断图片是否加载成功的更多相关文章
- JS判断图片是否加载完成三种方式
1.img的complete属性 轮询不断监测img的complete属性,如果为true则表明图片已经加载完毕,停止轮询.该属性所有浏览器都支持. <p id="p1"&g ...
- js 判断图片是否加载完成(使用 onload 事件)
我们在写 jquery 的时候一般都会写 $(document).ready,加载完成事件还有一个就是 onload onload 与 ready 的区别是: 1.ready 是 DOM 加载完成的事 ...
- js判断图片是否加载完毕
附件: https://www.jb51.net/article/102385.htm 问题: .offset().top和$(window).scrollTop()每次刷新页面后滚动的值有时候会不 ...
- js判断图片是否加载完成
var img = new Image(); //新建一个图片对象:img.src = ...; //图片地址是你准备要加载的地址:if(img.complete){ //表示图片已经加载完成}
- 关于JS判断图片是否加载完成且获取图片宽度的方法
做web的同学们经常会碰到客户上传图片将网页内容区撑破了的情况,下面就这个问题我们一种如何使用js处理这个问题的方法,具体思路就是在js判断客户端的图片下载完毕之后适时的对该图片的宽度或者高度做一些处 ...
- js 判断图片是否加载完成
1.根据url来加载图片: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 /** * 加载图片,直到加载完成后才调用回调函数 * @param url 后面读取图片流的u ...
- JS判断图片是否加载完成 背景图404 快到碗里来
面对这个问题 我最多做到表面笑嘻嘻 …… 真不知道测试怎么那么…… 啥都能给你测出来 有的没的都能给你测出来 算了算了 谁让本仙女本精灵本可爱温柔大方善解人意呢 …呵呵呵 ————————————正 ...
- 判断img图片是否加载成功
上班之余,记录一下工作中遇到的有趣问题... 事情是这样的...在做一个内嵌H5的app时,有一个“个人名片”页面...要求:如果后台接口有给头像的图片链接就用他们给的,如果没给,前端给个默认头像.. ...
- JS实现图片预加载无需等待
网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...
随机推荐
- phpwind之关闭账号通
phpwind的账号通功能早就失效了,但是首页的链接一直存在,造成了很不好的影响 但是后台打开账号通功能又打不开,所以想到了在前端的模板中通过屏蔽这部分代码的方法隐藏掉这个功能在首页的显示 1.打开/ ...
- Linux安装gcc编译器详解
本人使用的是CentOS 6.5 64位系统,由于在安装系统的时候并没有勾选安装gcc编译器,因此需要自行安装gcc编译器. 使用yum安装gcc 对于配备了yum的Linux发行版而言,安装gcc编 ...
- vim全选,全部复制,全部删除
全选(高亮显示):按esc后,然后ggvG或者ggVG 全部复制:按esc后,然后ggyG 全部删除:按esc后,然后dG 解析: gg:是让光标移到首行,在vim才有效,vi中无效 v : 是进入V ...
- [转]App Store 审核、限时免费、排行、推荐机制技巧精华汇总
在 App Store 上,什么样的应用会得到推荐? 这个问题问的非常大,而且编辑推荐很多个人元素在里面,我试着用推荐Ovi Store应用的思路来回答一下: 关于应用: 1.首先这个应用最基本的功能 ...
- Android 触摸手势基础 官方文档概览2
Android 触摸手势基础 官方文档概览 触摸手势检测基础 手势检测一般包含两个阶段: 1.获取touch事件数据 2.解析这些数据,看它们是否满足你的应用所支持的某种手势. 相关API: Moti ...
- centos7编译安装pure-ftpd-1.0.42
一.下载 wget https://download.pureftpd.org/pub/pure-ftpd/releases/pure-ftpd-1.0.42.tar.gz 二.安装 tar xvf ...
- C#微信json结构接收参数 转载
http://blog.csdn.net/u010773333/article/details/48524155 发素材的时间要上传资源故此要用json格式数据,需要转化. 微信服务器交互基本上都是j ...
- 4. read命令
4.1 作用 从标准输入中读取一行. 4.2 参数 -p 允许在read命令行中直接指定一个提示. -t 给用户的输入作限时规定. -n 规定read后变量所接收的字符的个数. -s 使得read命令 ...
- 黑马程序员_JAVA基础知识总结3
------- android培训.java培训.期待与您交流! ---------- Java源文件的扩展名是.java,编译之后生成.class的文件.所有的类都有一个共同的继承祖先Object类 ...
- 快速排序 && 希尔排序 && 插入排序
1. 快速排序 不稳定的排序. 平均(与最好情况)时间复杂度:O(nlgn) | 最坏情况时间复杂度(元素有序,递归栈为 O(n)):O(n2) 适合的数据结构:数组,双向链表. #includ ...