FormData
.利用FormData对象
,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的send()
方法来异步的提交这个"表单".比起普通的ajax,使用FormData
的最大优点就是我们可以异步上传一个二进制文件.
想要更详细的了解如何使用FormData
对象, 请查看使用FormData对象.
构造函数
new FormData (form? : HTMLFormElement)
参数
form
(可选)- 一个HTML表单元素,可以包含任何形式的表单控件,包括文件输入框.
方法
append()
给当前FormData对象添加一个键/值对
.
void append(DOMString name, Blob value, optional DOMString filename); void append(DOMString name, DOMString value);
参数值
name
- 字段名称.
value
- 字段值.可以是,或者一个字符串,如果全都不是,则该值会被自动转换成字符串.
filename
- (可选) 指定文件的文件名,当
value
参数被指定为一个Blob
对象或者一个File
对象时,该文件名会被发送到服务器上,对于Blob
对象来说,这个值默认为"blob".
注:如果你将一个Blob
对象作为字段值添加到一个FormData
对象中,则在使用Ajax将这个FormData
对象提交到服务器上时,提交数据中代表对应文件的文件名的"Content-Disposition"字段的值可能会因浏览器的不同而不同,规范中规定为"blob",Gecko早期实现版本中为空字符串,查看下面的Gecko附注.
浏览器兼容性
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | 7+ | 4.0 (2.0) | 10+ | 12+ | 5+ |
支持filename 参数 |
(Yes) | 22.0 (22.0) | ? | ? | ? |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | 3.0 | ? | 4.0 (2.0) | ? |
12+ |
? |
支持filename 参数 |
? | ? | 22.0 (22.0) | ? | ? | ? |
Gecko附注
在Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)之前,如果你将Blob
对象作为数据添加到一个FormData
对象中,则在使用Ajax将这个FormData
对象提交到服务器上时,所发送的HTTP请求头中代表那个Blob
对象所包含文件的文件名称的"Content-Disposition"请求头的值会是一个空字符串,这会引发某些服务器程序上的错误.从Gecko 7.0开始,这种情况下发送的文件名称改为"blob"这个字符串.