您的位置：首页 > 其它

如何判断图片是否加载完成

2015-03-25 09:16 225 查看

一、load事件

通过向img标签添加onload属性，并填入相应的函数来执行后续的javascipt代码。如下代码例子中img元素默认是不显示的，通过onload判断加载完成后再将图片显示出来。

<img class="pic1" onload="get(this)" src="" style='display:none' />

<script type="text/javascript">
function get(ts){
ts.style.display = 'block';  //显示图片
}
</script>

二、img的complete属性

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>img - complete attribute</title>

</head>

<body>

<img id="img1" src="">

<p id="p1">loading</p>

<script type="text/javascript">

function imgLoad(img, callback) {

var timer = setInterval(function() {

if (img.complete) {

callback(img)

clearInterval(timer)

}

}, 50)

}

imgLoad(img1, function() {

p1.innerHTML('加载完毕')

})

</script>

</body>

</html>

文章转载自：判断图片是否加载完成 http://www.studyofnet.com/news/745.html

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航