上传图片获取宽高

唐策 2018-09-06 11:04:56

1198

分类专栏： js 文章标签：上传图片获取宽高

本文链接：https://blog.csdn.net/qq_29132907/article/details/82457521

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>获取上传图片的宽高</title>
</head>
<body>
  <form>
    <input type="file" name="img_upload" id="img_upload" onchange="imgUpload();" />
  </form>
</body>
<script type="text/javascript">
  function imgUpload() {
    var file = document.getElementById('img_upload');
    createReader(file.files[0], function (w, h) { alert(w + ' '+ h)});
  }
  createReader = function(file, whenReady) {
    var reader = new FileReader;
    reader.onload = function (evt) {
        var image = new Image();
        image.onload = function () {
            var width = this.width;
            var height = this.height;
            if (whenReady) whenReady(width, height);
        };
        image.src = evt.target.result;
    };
    reader.readAsDataURL(file);
  }
</script>
</html>