将整个表单作为数据传递到jQuery Ajax函数中

Question

我有一个jQuery ajax函数，想提交一个完整的表单作为发布数据。我们正在不断更新表单，因此不断更新应该在请求中发送的表单输入变得很乏味。

Answer 1

如果要使用post方法发送表单，serialize（）并不是一个好主意。例如，如果您想通过ajax传递文件，它将无法正常工作。

假设我们有一个ID为“ myform”的表单。

更好的解决方案是制作一个FormData并将其发送：

    var myform = document.getElementById("myform");

    var fd = new FormData(myform );

    $.ajax({

        url: "example.php",

        data: fd,

        cache: false,

        processData: false,

        contentType: false,

        type: 'POST',

        success: function (dataofconfirm) {

            // do something with the result

        }

    });

Answer 2

通常serialize()在form元素上使用。

请注意，多个<select>选项在同一键下序列化，例如

<select id="foo" name="foo" multiple="multiple">

    <option value="1">one</option>

    <option value="2">two</option>

    <option value="3">three</option>

</select>

将导致一个查询字符串，其中包含多次出现相同的查询参数：

[path]?foo=1&foo=2&foo=3&someotherparams...

这可能不是您在后端中想要的。

我使用此JS代码将多个参数简化为以逗号分隔的单个键（在John Resig所在的线程中从评论者的响应中无耻地复制）：

function compress(data) {

    data = data.replace(/([^&=]+=)([^&]*)(.*?)&\1([^&]*)/g, "$1$2,$4$3");

    return /([^&=]+=).*?&\1/.test(data) ? compress(data) : data;

}

上面的内容变成了：

[path]?foo=1,2,3&someotherparams...

在您的JS代码中，您可以这样称呼它：

var inputs = compress($("#your-form").serialize());

希望能有所帮助。