表单提交,文件上传是一个常用又十分麻烦的功能,以前要上传文件通常都是借助插件或者flash来实现,噼里啪啦的加载一大堆东西。自从有了HTML5的FormData后。
FormData可以把它理解成一个虚拟的表单对象,它只有一个方法append,这个可以在浏览器console一下就知道了。我们可以通过append向FormData里面添加各种需要提交的数据。
你可以先创建一个空的 FormData
对象,然后使用 append()
方法向该对象里添加字段,如下:
var oMyForm = new FormData();
oMyForm.append("username", "Groucho");oMyForm.append("accountnum", 123456); // 数字123456被立即转换成字符串"123456" // fileInputElement中已经包含了用户所选择的文件oMyForm.append("userfile", fileInputElement.files[0]); var oReq = new XMLHttpRequest();oReq.open("POST", "http://foo.com/submitform.php");
// xhr.withCredentials = true; //如果需要Cookie等跨域用
oReq.send(oMyForm); php方面:
Access-Control-Allow-Origin: *Access-Control-Allow-Credentials: true(可选)