上传图片并预览

Myth丶恋晨 2021-11-23 10:16 883阅读 0赞

HTML：

  1. <input accept="image/*" name=" fileImage" type="file" onchange="upload">
  2. <img src="" id="img">

JS:

  1. upload = function(e){
  2.     let file = e.target.files[0];//file为需要上传的数据。
  3.     let fileReader = new FileReader();//创建FileReader对象。
  4.     fileReader.readAsDataURL(file);//将图片信息转换为URL信息。
  5.     fileReader.onload= function(){
  6.         document.getElementById("img").src = this.result;
  7.     }
  8. }

发表评论

表情：
评论列表 （有 0 条评论，883人围观）

还没有评论，来说两句吧...

相关阅读

    相关 图片预览与上传

    > 小编推荐：[Fundebug][]提供JS错误监控、微信小程序错误监控、微信小游戏错误监控，Node.j错误监控和Java错误监控。真的是一个很好用的错误监控费服务，众多大

    小鱼儿小鱼儿/ 0 赞/ 699 阅读

    相关 一个图片上传预览

    一、一个按钮上传文件操作 前台选择文件，只能通过input的file类型的文件选择框操作。但有时却为了界面的美观，要求用按钮来完成。 第一步、隐藏文件选择框 第二步、

    ╰半橙微兮°╰半橙微兮°/ 0 赞/ 713 阅读

    相关 原生js多图片上传并预览

    因为原生JS比较通用，不管你前端用的什么框架， 基本可以使用这套写法，也是参考网上的，自己写的不完善，基本提供一个思路，勿喷！！ html 代码，input标签里面一定要有m

    悠悠悠悠/ 0 赞/ 591 阅读