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来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...
随机推荐
- 关于char类型的连续输入
这个忘了好久了 先回想吧 一 单字符 ① char m; scanf("%d",&m); ② char m; m=getchar(); putchar(m); 二 字符数 ...
- mysql存储过程详解(入门)
delimiter // #修改结束符号为// create procedure pro_wyx() /*创建存储过程*/ begin declare i int ; #定义变量 set i=1 ...
- 一个链式调用 setTimeout的例子
<div> 现在时间是:<input type="text" id="name1" size="16" value=&qu ...
- c语言多线程队列读写
最近用c语言写了个简单的队列服务,记录一下,文件结构为 main.c queue.c queue.h,代码如下: 主函数 #define NUM_THREADS 200 #include <st ...
- Spring使用环境变量控制配置文件加载
项目中需要用到很多配置文件,不同环境的配置文件是不一样的,因此如果只用一个配置文件,势必会造成配置文件混乱,这里提供一种利用环境变量控制配置文件加载的方法,如下: 一.配置环境变量 如果是window ...
- Win7打补丁以后vs2012突然出现的程序版本不兼容问题
装这个: Update for Microsoft Visual Studio 2012 (KB2781514) http://www.microsoft.com/en-us/download/det ...
- maya,mel,eval,stringarray
mel里,当要eval("client()"),并且要传递stirngarray参数给函数client()时,正确的写法应该是: global proc intermediator ...
- ThinkPad E440 加内存后导致开不了机
上周五新买的ThinkPad E440,原装内存是4G DDR3 1600Hz,明显不够用,于是在京东上买了一根南亚易胜的4G DDR3 1600Hz.安装之后正常开机,明显感觉速度快了很多.可是用了 ...
- PHP 开发的 API 多版本管理实践
遇到的情况 本文针对移动互联网客户端需要兼容旧版的情况,强制升级到最新版本的 app 不在讨论之列. 在 bugtags.com 项目中,我们的版本遵循下面规范.1.0.1大功能.小更新.bug 修正 ...
- Bootstrap for MVC:Html.Bootstrap().TextBoxFor(model=>model.Name)
在上篇博文中提到最近比较忙,也打过招呼Orchard系列文章更新速度可能会放缓,但还是会继续写下去,主要原因在最近想着开发一个新的东西(系统?组件?),等有一定成果时会跟大家分享一些相关的东西,今天介 ...