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来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...
随机推荐
- SPOJ QTREE Query on a tree
题意:给一颗n个点的树,有两种操作CHANGE i ti : 把第i条边的权变为tiQUERY a b : 问点a 到 点b 之间的边的最大权 思路:树剖处理边权.由于是边,所以只需要把边权处理到子节 ...
- vb6 枚举对象属性
Option Explicit '引用Library TLI ' C:\WINDOWS\system32\TLBINF32.DLL ' TypeLib Information Private Sub ...
- Google 的开源技术protobuf 简介与例子
本文来自CSDN博客:http://blog.csdn.NET/program_think/archive/2009/05/31/4229773.aspx 今天来介绍一下"Protocol ...
- 【netty】Netty系列之Netty百万级推送服务设计要点
1. 背景 1.1. 话题来源 最近很多从事移动互联网和物联网开发的同学给我发邮件或者微博私信我,咨询推送服务相关的问题.问题五花八门,在帮助大家答疑解惑的过程中,我也对问题进行了总结,大概可以归纳为 ...
- Document types require more than xhtml1.0
这个东西只会在比较低版本的浏览器中会出现,比如IE7及以下会出这个错误. 错误的根源是html页面没有考虑浏览器兼容性问题. 在页面头部加入下面的内容即可解决标题中的问题 <!DOCTYPE h ...
- 【转】Reactor与Proactor两种模式区别
转自:http://www.cnblogs.com/cbscan/articles/2107494.html 两种IO多路复用方案:Reactor and Proactor 一般情况下,I/O 复用机 ...
- WEB-INF目录下的文件访问权限(待解决)
对于Tomcat服务器而言,WEB-INF目录下的文件是不能通过在浏览器中直接输入地址的方式来访问. 原因:还不清楚
- ulipad python配置
运行 打开程序之后,界面非常友好,创 ...
- 实验室ip同步脚步
#!/bin/bash PATH=/usr/local/sbin:/usr/local/bin:/sbin:/bin:/usr/sbin:/usr/bin hostname=`hostname` us ...
- ISO 14229 简介 转载
作者:autogeek 原文链接:http://www.cnblogs.com/autogeek/p/4458591.html 前言 由于工作中经常用到ISO-14229,因此决定对该协议做个总体介绍 ...