上传图片前判断图片的尺寸

JavaScript上传图片时,通常会有需求对上传图片的尺寸及大小进行判断,怎样在不显示图片的情况下进行尺寸的判断呢?如下:

var img = new Image();  
img.src = 'data:image/png;base64,' + data;  //data为base64数据;
setTimeout(function(){  //之所以要使用定时器,是因为给图片的src赋值时,即使是base64格式,浏览器也需要时间来加载图片,因此需要延迟获取图片的尺寸,否则,图片的尺寸可能为0
  var imgW = img.width;   //图片的原始宽度
  var imgH = img.height;  //图片的原始高度
},0)

现在HTML5出了新特性查看图片的原始尺寸:naturalWidth和naturalHeight;

使用新特性时是需要判断游览器的兼容性

因此,上面获取宽高的代码可以改为:

var imgW = img.naturalWidth;
var imgH = img.naturalHeight;

 

posted @ 2017-05-15 15:01  hello八戒  阅读(613)  评论(0编辑  收藏  举报