H5--文件上传(显示文件)

简介: H5--文件上传(显示文件)

20190904164319930.png

20190904164349373.png

需求:上传照片后,在文件上传控件下方显示已经上传的图片文件
  <form action="">
  文件:<input type="file" name="myFile" id="myFile" onchange="getFile()" value="" /><br>
    <input type="submit" name=""/>
    <div><img src="" id="img"/></div>
  </form>
  function getFile(){
    var reader=new FileReader();
    var file=document.querySelector('#myFile').files;
    console.log(file);
    reader.readAsDataURL(file[0]);
    reader.onload=function(){
      console.log(reader.result);
      document.querySelector("#img").src=reader.result;
    }
  }


相关文章
|
3月前
|
容器
查看文件内容命令
查看文件内容命令
29 0
|
3月前
Win11怎么设置显示文件扩展名
Win11怎么设置显示文件扩展名
257 2
|
9月前
|
Linux
【Linux命令200例】用file检查文件类型
在Linux系统中,file命令是一个用于检查文件类型的工具。它可以通过读取文件内容的特征来确定文件的类型,从而帮助用户识别和处理文件。`file`命令常用于获取文件的基本信息,如文件类型、编码格式等。
156 0
|
11月前
|
Linux
linux命令basename:去掉路径和扩展名,得到指定文件的文件名(去除文件扩展名.xxx)
linux命令basename:去掉路径和扩展名,得到指定文件的文件名(去除文件扩展名.xxx)
126 0
|
Python
Python获取指定目录下的所有文件路径、获取指定目录下所有文件名(但是不包含子目录中文件名)、获取指定目录下所有pdf文件名(但是不包含子目录中pdf文件名)
Python获取指定目录下的所有文件路径、获取指定目录下所有文件名(但是不包含子目录中文件名)、获取指定目录下所有pdf文件名(但是不包含子目录中pdf文件名)
193 0
|
存储 Linux 网络安全
系统目录结构/ls命令/文件类型/alias命令
2.1/2.2 系统目录结构 2.3 ls命令 2.4 文件类型 2.5 alias命令 linux文件目录结构 linux文件结构 / 系统跟目录 root  root用户主目录,存放启动linux系统的核心文件,如操作系统的内核、引导程序grub等 home 普通用户主目录 bin 存放系统启动时需要执行的二进制文件,普通用户使用的命令。
1319 0