js 判断图片是否加载完成

1、根据url来加载图片：

/**

* 加载图片，直到加载完成后才调用回调函数

* @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);

}

}, 50);

}

2、定义callback函数：

function testFun(img){

console.log('into testFun');

}

3、调用上面的方法，代码如下：

1	`loadImage(url+'?datetime='+new` `Date().getTime(),testFun);`

转载于:https://www.cnblogs.com/telwanggs/p/5306122.html

js 判断图片是否加载完成相关推荐

JS判断图片是否加载完毕
/*** @function Determine if the image has been loaded.* @param img,callback*/ function imgIsLoaded(i ...
【转】JS判断SWF,JPG加载完毕、兼容（Activex,plugIn）所有浏览器
JS判断SWF,JPG加载完毕.兼容(Activex,plugIn)所有浏览器这里主要说下监听SWF的加载. 网上流传已久的监听方法,只能在IE(Activex插件下)下实现.在使用plugin的浏 ...
JS实现图片预加载无需等待
网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...
js 判断iframe是否加载完毕
js 判断iframe是否加载完毕 CreationTime--2018年9月13日15点30分 Author:Marydon 1.javascript实现 window.onload = funct ...
react 判断图片是否加载完成_React中型项目的优化实践
项目介绍整个项目大概有60+个页面,用到的组件大概150+,package里面的依赖大概有70+个,应该勉强算得上是一个中型的React的项目了. 下面给大家看看我们现在build一次项目的结果-- ...
JS实现图片懒加载效果
文章目录前言一.图片实现懒加载步骤二.案例练习(三国女将) 1. html 代码 2. css 代码 3. js 代码执行结果前言懒加载时一种也页面效果,可以提高页面加载速率,并降低服务器 ...
js实现图片懒加载原理（marksheng）
有时候一个网页会包含很多的图片,例如淘宝京东这些购物网站,商品图片多只之又多,页面图片多,加载的图片就多.服务器压力就会很大.不仅影响渲染速度还会浪费带宽.比如一个1M大小的图片,并发情况下,达到10 ...
html显示图片原理,html+js实现图片预加载,lightbox底层原理。
在前端设计时,为了让某县页面的图片即使缓存到浏览器中,一般使用预加载技术,但更为确切的应该称为异步加载,因为对线程不会造成阻塞. 图片是网站开发部分中的静态资源,当浏览器网络请求到图片时会首先缓存,然 ...
js实现图片懒加载原理
有时候一个网页会包含很多的图片,例如淘宝京东这些购物网站,商品图片多只之又多,页面图片多,加载的图片就多.服务器压力就会很大.不仅影响渲染速度还会浪费带宽.比如一个1M大小的图片,并发情况下,达到10 ...

js 判断图片是否加载完成

js 判断图片是否加载完成相关推荐

最新文章

热门文章