前端本地文件操作与上传

时间:2021-11-17 来源:未知网络 作者:996建站网

前端无法像原生APP一样直接操作本地文件,否则的话打开个网页就能把用户电脑上的文件偷光了,所以需要通过用户触发,用户可通过以下三种方式操作触发:

  1. 通过input type="file" 选择本地文件
  2. 通过拖拽的方式把文件拖过来
  3. 在编辑框里面复制粘贴

第一种是最常用的手段,通常还会自定义一个按钮,然后盖在它上面,因为type="file"的input不好改变样式。如下代码写一个选择控件,并放在form里面:

<form>
    <input type="file" id="file-input" name="fileContent">
</form>

前端本地文件操作与上传插图

微信扫一扫 关注公众号

微信扫一扫 使用小程序

百度扫一扫 使用小程序