javascript - 如何使用 GET 方法通过 XMLHttpRequest 传递 FormData

Question

当 senderform 的方法是 POST 时，一切正常。但是，一旦我将方法更改为 GET，我就不会在服务器上收到任何东西。

function ajaxSubmit(destinationElement, senderform) {

    var xmlreq = new XMLHttpRequest();
    var params = new FormData(senderform);
    xmlreq.open(senderform.method, senderform.action, true);

    if (/\/content\.php$/.test(senderform.action))
        xmlreq.onreadystatechange = receiveTable;
    else xmlreq.onreadystatechange = receiveText;

    xmlreq.send(params);
}

我知道我可以 manually append key-value pairs在操作地址的末尾，但问题是我不知道哪个表单将通过哪些字段传递。

如果可能的话，我更喜欢原生 javaScript。

我如何使用 XMLHttpRequest 和来自 senderform 的键值对发送 GET 请求，它指向表单元素(与它已经用于 POST 请求的方式相同)？

Answer 1

第一个参数是对提交按钮或表单元素本身的引用。其次是 XMLHttpRequest 的回调函数。

var ajaxSubmit = function(sender, callback) {
    var xmlreq = new XMLHttpRequest(), params;
    // look around for the sender form and key-value params
    if (sender.form !== undefined)
    {
        params = new FormData(sender.form);
        params.append(sender.name, sender.value);
        sender = sender.form;
    }
    else params = new FormData(sender);
    var actAddress = sender.action;

    // append the params to the address in action attribute
    if (sender.method == 'get')
    {
        var firstRun = true;
        for (var key of params.keys())
        {
            if (firstRun)
            {
                actAddress += '?';
                firstRun = false;
            }
            else actAddress += '&';
            actAddress += key + "=" + params.get(key);
        }
    }
    
    xmlreq.open(sender.method, actAddress, true);
    xmlreq.onreadystatechange = callback;
    if (sender.method == 'get')
        xmlreq.send();
    else xmlreq.send(params);
}

因此您可以将其用作

<form onsubmit="ajaxSubmit(this,callbackFx)" >
<!-- or -->
    <input onclick="ajaxSubmit(this,callbackFx)" type="submit" name="" value=""/>
</form>