使用 AJAX 提交多个表单

Question

我有一个包含多个表单的页面。我想添加一个提交按钮，可以同时保存所有表单，如下图所示：

<form id="form1" name="form1" action="someAction" method="post">
    ....form fields
</form>

<form id="form2" name="form2" action="someOtherAction" method="post">
    ....form fields
</form>

<form id="form2" name="form2" action="anotherAction" method="post">
    ....form fields
</form>

<a href="somewhere.html" onclick="submitAll();">Submit All Forms</a>

<script>
    function submitAll() {
        document.form1.submit();
        document.form2.submit();
        document.form3.submit();
    }
</script>

我遇到的问题是，一旦第一个表单被提交，它会将页面重定向到该表单的目的地 - 我想拦截该重定向，以便我可以处理下一个表单。

我知道这可以通过 AJAX 来完成，这会以某种方式让我捕获返回的页面（如果我愿意，可以忽略它），但如果不映射每个字段，我无法弄清楚如何做到这一点手动输入表格。

谁能帮忙？

Answer 1

这应该通过 ajax 提交每个表单，而不必自己映射字段：

$('form').each(function() {
    var that = $(this);
    $.post(that.attr('action'), that.serialize());
});