FormData()

FormData()构造函数用于创建一个新的FormData对象。

注意: 该功能在 Web Workers 中可用。

语法

var formData = new FormData(form)

参数

form 可选: 一个HTML 上的<form>表单元素——当指定了，这种方式创建的FormData对象会自动将form中的表单值也包含进去，包括文件内容也会被编码之后包含进去。

例子

下面的代码将创建一个空的FormData对象:

var formData = new FormData(); // 当前为空

你可以使用FormData.append来添加键/值对到表单里面；

formData.append('username', 'Chris');

或者你可以使用可选的form参数来创建一个带预置数据的FormData对象:

<form id="myForm" name="myForm">
  <div>
    <label for="username">Enter name:</label>
    <input type="text" id="username" name="username">
  </div>
  <div>
    <label for="useracc">Enter account number:</label>
    <input type="text" id="useracc" name="useracc">
  </div>
  <div>
    <label for="userfile">Upload file:</label>
    <input type="file" id="userfile" name="userfile">
  </div>
<input type="submit" value="Submit!">
</form>

注意: 所有的输入元素都需要有name属性，否则无法访问到值。

var myForm = document.getElementById('myForm');
formData = new FormData(myForm);

规范

规范	状态	备注
XMLHttpRequest FormData()	Living Standard	Initial definition

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help! (en-US)

Desktop
Mobile

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic support	7	4.0 (2.0)	10	12	5
append with filename	(Yes)	22.0 (22.0)	?	?	?
available in web workers	(Yes)	39.0 (39.0)	(Yes)	(Yes)	(Yes)

Feature	Android	Chrome for Android	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support	3.0	?	4.0 (2.0)	?	12	?
append with filename	?	?	22.0 (22.0)	?	?	?
Available in web workers	?	?	39.0 (39.0)	?	?	?

注意: XHR在Android 4.0上FormData的blob数据将发送空内容。

附注

在Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)之前, 如果你将Blob作为数据添加到form对象中，文件名就是空的，这可能导致服务器在HTTP头的Content-Disposition中设置的文件名为空而引起错误。从Gecko 7.0开始, 将会使用"blob"作为Blob数据的文件名。

FormData()

语法

参数

例子

规范

浏览器兼容性

附注

相关链接