Js实现input上传图片并显示缩略图

前端小李

于 2019-10-25 09:40:16 发布

阅读量669

点赞数

分类专栏： js 文章标签： js

本文链接：https://blog.youkuaiyun.com/qq_43287934/article/details/102737026

版权

js 专栏收录该内容

12 篇文章

订阅专栏

function previewFile() {
  var preview = document.querySelector('img');
  var file    = document.querySelector('input[type=file]').files[0];
  var reader  = new FileReader();

  reader.onloadend = function () {
    preview.src = reader.result;
  }

  if (file) {
    reader.readAsDataURL(file);
  } else {
    preview.src = "";
  }
}
<input type="file" onchange="previewFile()"><br>
<img src="" height="200" alt="Image preview...">