文件上传功能(一)

2 篇文章 0 订阅

要实现文件上传功能,作为一个普遍的功能,HTML为我们提供了一种便捷的方法。

1.在form表单中就能够完成。

<form action='' enctype=''>
  <input type="file" multiple>
  <input type="submit" valiu="提交">
</form>

点击选择文件后,就可以点击提交发送文件到服务端
form标签中的action属性是服务端地址?或者是接口
enctype属性,在get请求时会被忽略,在发送post请求时,这些值会包含在请求头信息中,又分为了三种情况:
1. application/x-www-form-urlencoded(默认)
2.text/plain
3.multipart/form-data
其中的区别去你采用什么样的编码方式

input type='file' 中的multiple属性设置了的话,就可以选择多个文件同时上传

这些都是浏览器在你提交form表单是自动完成的。

那如果想要在js中手动的去提交文件这样一个功能,要借助两个知识点:

1.XMLHttpRequest,这个应该单独列一张出来理解

2.FormData对象,可以看做是专门用来放置表单信息的一个对象?

  

var formData = new FormData();
然后可以使用append方法往formData对象中添加键值对;
接受两个参数,执行完后都会变成字符串
formData.append('textInfo','456')

参考这个链接的代码点击打开链接


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值