码迷,mamicode.com
首页 > Web开发 > 详细

js判断图片加载完成

时间:2016-04-06 14:56:59      阅读:168      评论:0      收藏:0      [点我收藏+]

标签:

判断图片是否加载完成有三种方式。

一、load事件

img.onload = function() {
  alert(‘加载完毕‘); 
}

测试,所有浏览器都显示出了“加载完毕”,说明所有浏览器都支持img的load事件。

 

二、readystatechange事件

          img.onreadystatechange = function() {
            if(img.readyState=="complete"||img.readyState=="loaded"){
                alert(‘加载完毕‘)
            }
        }

readyState为complete和loaded则表明图片已经加载完毕。测试IE6-IE10支持该事件,其它浏览器不支持。

 

三、complete属性

          function imgLoad(img, fn) {
            var timer = setInterval(function() {
                if (img.complete) {
                    fn()
                }
            }, 50)
        }
        imgLoad(img, function() {
            alert(‘加载完毕‘);
        })
 

轮询不断监测img的complete属性,如果为true则表明图片已经加载完毕,停止轮询。该属性所有浏览器都支持。

js判断图片加载完成

标签:

原文地址:http://www.cnblogs.com/moz-1105/p/5359269.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!