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来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...
随机推荐
- apktool反编译apk文件
1.首先下载apktool文件,可以从我的网盘下载:http://pan.baidu.com/s/1nvPdbVb 2.将你的apk文件和apktool文件放到一个文件夹下,这里就放到D:\study ...
- CSS3-transition,过渡实例
过渡:transition[由Webkit内核浏览器提出] 通过CSS实现元素从一个样式渐变成另一个种. IE不支持,其他需后缀. transition:transition-property/dur ...
- Git 常用命令整理
初始化配置 #配置使用git仓库的人员姓名 git config --global user.name "Your Name Comes Here" #配置使用git仓库的人员em ...
- phpunit4.1的干净测试
一般而言,写测试时需要加载一些文件来进行自动加载 但在phpunit4.1中只要其中一个测试文件加载了,其他测试文件就不需要再加载
- 将数据集做成VOC2007格式用于Faster-RCNN训练
1.命名 文件夹名VOC2007.图片名六位数字.将数据集相应的替换掉VOC2007中的数据. (Updated development kit, annotated test data ) 2. ...
- PL/0语言编译器的设计与实现
一.设计任务 1.1程序实现要求 PL/0语言可以看成PASCAL语言的子集,它的编译程序是一个编译解释执行系统.PL/0的目标程序为假想栈式计算机的汇编语言,与具体计算机无关. PL/0的编译程序和 ...
- Hibernate5.2关联关系之单向一对多(一)
Hibernate5.2之单向一对多 一. 简介 Hibernate中最复杂的应该就是各种关联(单向一对多.单向多对一.双向一对多.一对一.多对多)关系的映射,于是笔者就想着去写一些关于Hibe ...
- FileUploadInterceptor拦截器的笔记
当请求表单中包含一个文件file,FileUploadInterception拦截器会自动应用于这个文件. 表单: <s:form namespace="/xxx" acti ...
- XAMPP(Linux版-x86兼容)官网下载
欢迎光临 XAMPP 的 Linux 版 (x86 兼容处理器版)顺便提一下:该软件以前被称作 LAMPP,但为了避免误解,我们将其重名命为 »XAMPP 的 Linux 版«.所以,如果您在寻找 L ...
- SVN服务器详细权限控制
版权声明:本文为博主原创文章,未经博主允许不得转载. 下面是我配置SVN服务器的过程,现在把我所配置的方法,记录下来,以供其他有需要的朋友参考,需要改进的地方,请指教! 一 环境 操作系统:windo ...