使用form、FormData进行的文件提交。

PHP中文网 JavaScript 百度已收录

当前第2页 返回上一页

二、FormData

FormData是ES提供的一个API，使用它可以实现ajax的文件提交：

下面来看FormData的使用方法：


var formData = new FormData(); //创建实例,可以传入form对应的DOM节点作为参数，则表单中的数据就会保存到formData实例中。

formData.append(name, value); //使用方法append，传入对应的键和值

// 其他代码

最后将form实例扔到xhr.send()；中即可。

xhr.send(formData);

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

var xhr = new XMLHttpRequest();

//使用FormData构造函数创建一个FormData的实例

var formData = new FormData();

// formData.append('file0', oInput.value);

//注意，这里的value不是普通的表单value，而是一个file对象

formData.append('file0', oInput.files[0]);

xhr.open('POST', 'http://localhost:8080'); 

xhr.onload = function(){ 

  if(xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) { 

    console.log(xhr.responseText); 

  } 

};

//form表单的默认值为①，而FormData的默认值为multipart/form-data,所以不用画蛇添足的去修改请求头 

//xhr.setRequestHeader('Content-Type', 'multipart/form-data');

xhr.send(formData);


上面有提到，传入append的值，不是普通的input的value，而是一个file对象，有关file对象的知识限于篇幅暂不讲解，有兴趣可以自行百度。

而除了这些，对文件的操作除了一般的小体积文件，更多的则是类似于视频网站对视频这种大型文件的操作，仅仅了解这些是不足以完成这些工作的。还要学习有关的API和深入理解blob对象。 大家可以自己下去学习， 有关这方面的总结我会在以后发表。

本文讲解了使用form、FormData进行的文件提交相关内容，更多相关内容请关注php中文网。

相关推荐：

JQuery中DOM操作――wrap

django 使用 request 获取浏览器发送的参数

React this绑定的几点思考

以上就是使用form、FormData进行的文件提交。的详细内容，更多文章请关注木庄网络博客！

返回前面的内容

相关阅读 >>

使用form、FormData进行的文件提交。

更多相关阅读请进入《form、FormData》频道 >>




标签：

打赏

取消

感谢您的支持，我会继续努力的!

扫码支持
扫码打赏，您说多少就多少

打开支付宝扫一扫，即可进行扫码打赏哦

分享从这里开始，精彩与您同在

相关推荐

评论

管理员已关闭评论功能...