formdata用法

formdata用法

用法

对象的创建

创建一个formdata对象，用append方法添按照（属性，值）的方法添加数据。
例1：

//创建对象
var oMyForm = new FormData();
//添加数据 
oMyForm.append("username", "Groucho");
oMyForm.append("password", 123456); // 数字123456被立即转换成字符串"123456"

// 添加文件数据，需获取file类型input
oMyForm.append("userfile", fileInputElement.files[0]);

可以利用表单初始化formdata对象
例2：

需先获取form表单
var newFormData = new FormData(Form);
//用append方法添加数据可以代替input  type=hidden写法

数据提交

jquery ajax举例

$.ajax({
    url:"",
    data:newFormData,
    processData: false,  // 告诉jQuery不要去处理发送的数据
    contentType: false,   // 告诉jQuery不要去设置Content-Type请求头
    success:function(){}
})

发送时直接将创建的formdata作为数据对象发送即可。注意的是要设置ajax的processdata属性和contenttype属性，在原生ajax中是setrequestheader函数中设置相应属性。这两个属性作用这里不再赘述。

注意点

1.h5新增，有兼容问题，如需在不兼容的浏览器中使用ajax提交表单，可以使用jquery的form插件（支持文件提交），或者serialize方法（不支持文件）
2.注意两个ajax对象属性
3.用formdata场景：ajax提交文件，或者说在提交表单时提交额外的信息。