通过JS中的XMLHttpRequest对象发布formdata？(跨浏览器)

Question

我试图在js中发布表单数据:

我有这个代码:

var formData = new FormData();
  formData.append("username", "Groucho");
  formData.append("accountnum", 123456);
  formData.append("afile", "2");

var xhr = new XMLHttpRequest();
xhr.open("POST", "http://xxxxx/xx.ashx",true);
xhr.send(formData);

根据MDN的 Formdata 在IE(或未知)中不可用.

当我在FF中尝试这个:

(我觉得很好......).

当我在IE中尝试时:

发布表单数据(或我的数据,但客观方式)CROSSBROWSER的解决方案是什么？

Answer 1

我写了一个简单的包装器,你可以使用它在IE中发送FormData(它也不会搞乱webkit/gecko中的任何东西).在尝试使用FormData之前,只需包含以下js:

var ieFormData = function ieFormData(){
if(window.FormData == undefined)
{
    this.processData = true;
    this.contentType = 'application/x-www-form-urlencoded';
    this.append = function(name, value) {
        this[name] = value == undefined ? "" : value;
        return true;
    }
}
else
{
    var formdata = new FormData();
    formdata.processData = false;
    formdata.contentType = false;
    return formdata;
}

}

现在只需将所有新的FormData()调用切换到新的ieFormData(),然后切换

processData: false, 
contentType: false,

至

processData: formdata.processData,
contentType: formdata.contentType,
cache: false,

你们都准备好了.当然,这不允许你包含文件(你仍然需要iframe黑客),但它允许你模仿IE中的FormData.

Answer 2

你没有说你用的是哪个版本的IE。IE9 或更低版本不支持 formData 对象。IE10 应该支持 XMLHTTPRequest2（包含 formData 对象）（http://caniuse.com/xhr2）

跨浏览器AJAX文件上传现在很难做到。您可以尝试在 Javascript 中构建自己的表单标头/边界（请参阅此处的答案：XMLHttpRequest POST multipart/form-data），但就我个人而言，我认为这不值得付出努力。