首页 > 代码库 > 关于JS判断图片是否加载完成且获取图片宽度的方法
关于JS判断图片是否加载完成且获取图片宽度的方法
做web的同学们经常会碰到客户上传图片将网页内容区撑破了的情况，下面就这个问题我们一种如何使用js处理这个问题的方法，具体思路就是在js判断客户端的图片下载完毕之后适时的对该图片的宽度或者高度做一些处理，js处理图片主要是利用js中Image对象，通过 onl oad 事件和 onreadystatechange 来进行判断。
（1）第一中方法，通过onload事件，比如：
<script type="text/javascript">var obj=new Image();obj.src="http://www.phpernote.com/uploadfiles/editor/201107240502201179.jpg";obj.onload=function(){alert(‘图片的宽度为：‘+obj.width+‘；图片的高度为：‘+obj.height);document.getElementById("mypic").innnerHTML="<img src=http://www.mamicode.com/‘"+this.src+"‘ />";}</script>
<div id="mypic">onloading……</div>
（2）第二种方法，使用 onreadystatechange 来判断
<script type="text/javascript">var obj=new Image();obj.src="http://www.phpernote.com/uploadfiles/editor/201107240502201179.jpg";obj.onreadystatechange=function(){if(this.readyState=="complete"){alert(‘图片的宽度为：‘+obj.width+‘；图片的高度为：‘+obj.height);document.getElementById("mypic").innnerHTML="<img src=http://www.mamicode.com/‘"+this.src+"‘ />";}}</script>
<div id="mypic">onloading……</div>
关于JS判断图片是否加载完成且获取图片宽度的方法
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。