// HTML<img id=‘xiu‘ src="http://www.daqianduan.com/wp-content/uploads/2014/11/hs-xiu.jpg"> ?//js $(document).ready(function(){ ???//jquery ???$(‘#xiu‘).load(function(){ ??????// 加载完成 ????}); ??//原生 ?onload ???var xiu = document.getElementById(‘xiu‘) ???xiu.onload = xiu.onreadystatechange = function(){ ??????if(!this.readyState||this.readyState==‘loaded‘||this.readyState==‘complete‘){ ??????????// 加载完成 ???????} ???};})
1、IE8及以下版本不支持onload事件,但支持onreadystatechange事件;
2、readyState是onreadystatechange事件的一个状态,值为loaded或complete的时候,表示已经加载完毕。
多张图片
var img = [], ?????flag = 0, ????mulitImg = [ ???‘http://www.daqianduan.com/wp-content/uploads/2017/03/IMG_0119.jpg‘, ???‘http://www.daqianduan.com/wp-content/uploads/2017/01/1.jpg‘, ???‘http://www.daqianduan.com/wp-content/uploads/2015/11/jquery.jpg‘, ???‘http://www.daqianduan.com/wp-content/uploads/2015/10/maid.jpg‘ ]; var imgTotal = mulitImg.length; for(var i = 0 ; i < imgTotal ; i++){ ???img[i] = new Image() ???img[i].src = mulitImg[i] ???img[i].onload = function(){ ??????//第i张图片加载完成 ??????flag++ ??????if( flag == imgTotal ){ ?????????//全部加载完成 ??????} ???} }
js 判断图片加载完成
原文地址:https://www.cnblogs.com/chaser-li/p/8266842.html