使用 FormData 对象上传文件
你还可以使用 FormData 上传文件。使用的时候需要在表单中添加一个文件类型的 input：
html
然后使用下面的代码发送请求：
jsvar form = document.forms.namedItem("fileinfo");
form.addEventListener(
"submit",
function (ev) {
var oOutput = document.querySelector("div"),
oData = new FormData(form);
oData.append("CustomField", "This is some extra data");
var oReq = new XMLHttpRequest();
oReq.open("POST", "stash.php", true);
oReq.onload = function (oEvent) {
if (oReq.status == 200) {
oOutput.innerHTML = "Uploaded!";
} else {
oOutput.innerHTML =
"Error " +
oReq.status +
" occurred when trying to upload your file.
";
}
};
oReq.send(oData);
ev.preventDefault();
},
false,
);
备注：如果 FormData 对象是通过表单创建的，则表单中指定的请求方式会被应用到方法 open() 中。
你还可以直接向 FormData 对象附加 File 或 Blob 类型的文件，如下所示：
jsdata.append("myfile", myBlob, "filename.txt");
使用 append() 方法时，可以通过第三个可选参数设置发送请求的头 Content-Disposition 指定文件名。如果不指定文件名（或者不支持该参数时），将使用名字“blob”。
如果你设置正确的配置项，你也可以通过 jQuery 来使用 FormData 对象：
jsvar fd = new FormData(document.querySelector("form"));
fd.append("CustomField", "This is some extra data");
$.ajax({
url: "stash.php",
type: "POST",
data: fd,
processData: false, // 不处理数据
contentType: false, // 不设置内容类型
});