FormData对象异步上传文件

XMLHttpRequest Level 2添加了一个新的接口FormData，利用FormData对象，我们可以使用XMLHttpRequest的send()方法异步的提交数据，比起普通的ajax，使用FormData的最大优点是可以异步上传一个二进制文件

var a = new FormData();
//使用append方法向空的FormData对象里添加字段
a.append('username','Jack');
a.append('age',17);	//数字会被转换成字符串
a.append('userfile',files);	//上传文件
a.append('webmasterfile',oBlob);	//二进制对象
var oReq = new XMLHttpRequest();
oReq.open('POST','submitform.php');
oReq.send(a);
//注意：值可以为Blob对象，File对象或者字符串，其它类型的值都会被自动转换为字符串处理

//使用html表单来初始化一个FormData对象
var a = document.getElementById('form');
var oReq = new XMLHttpRequest();
oReq.open('POST','submitform.php');
oReq.send(new FormData(a));

//使用FormData异步上传用户所选择的文件
function sendForm(){
	var txt = document.getElementById('txt');
	var a = new FormData(document.getElementById('file'));
	var oReq = new XMLHttpRequest();
	oReq.open('POST','submitform.php',true);
	oReq.onload = function(oEvent){
		if(oReq.status == 200){
			txt.innerHTML = 'Uploaded!';
		}else{
			txt.innerHTML = 'Error' + oReq.status;
		}
	}
	oReq.send(a);
}

//使用jQuery来发送FormData，但必须要正确的设置相关选项
var a = new FormData(document.getElementById('file'));
$.ajax({
	url : 'submitform.php',
	type : 'POST',
	data : a,
	processData : false,	//告诉jQuery不要去处理发送的数据
	contentType : false		//告诉jQuery不要去设置Content-Type请求头
})

https://developer.mozilla.org/zh-CN/docs/Web/Guide/Using_FormData_Objects