代码描述:JavaScript判断img图片 是否加载完毕。JavaScript判断img图片是否加载完毕代码下载
本章节介绍一下如何判断一个图片是否加载完毕,实现此功能的方式有多种,下面就对比较常用的做一下简单介绍,希望能够给需要的朋友带来帮助,下面进入正题。 实现方式一:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="https://www.51qianduan.com/" /> <title>51前端</title> </head> <body> <img id="theimg" src="mytest/demo/tree.jpg"/> <p id="loadding">loading...</p> <script type="text/javascript"> theimg.onload=function(){ loadding.innerHTML='加载完毕' } </script> </body> </html>
以上代码可以实现我们的要求,当图片加载完毕就会触发onload事件。 实现方式二:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="https://www.51qianduan.com/" /> <title>51前端</title> </head> <body> <img id="theimg" src="mytest/demo/tree.jpg"/> <p id="loadding">loading...</p> <script type="text/javascript"> theimg.onreadystatechange=function(){ if(theimg.readyState=="complete"||theimg.readyState=="loaded"){ loadding.innerHTML = '加载完毕' } } </script> </html>
请绑定手机号,在继续操作
注意:只有绑定手机以后,才可使用网站全部功能