使用 when() 运行多个 Ajax 函数答案

【问题标题】：Using when() to Run Multiple Ajax Functions使用 when() 运行多个 Ajax 函数
【发布时间】：2017-04-10 18:50:07
【问题描述】：

使用 jQuery when()，我试图在表单提交上运行多个 Ajax 函数，等到他们得到响应，完成后，最后提交表单。我的代码是：

$('form[name="regForm"]').on('submit', function( e ) {
    e.preventDefault();

    $.when( function () {
        ajaxOne();
        ajaxTwo();
        ajaxThree();
    }
    ).done(function() {
        $('form[name="regForm"]').unbind('submit').submit();
    });
});

表单已提交，但 Ajax 函数从未触发。我究竟做错了什么？感谢您的帮助。

【问题讨论】：

提交时页面是否重新加载？您是否检查过上述事件是否被触发？控制台有错误吗？
表单已提交，但 Ajax 函数未执行。
ajaxOne 应该返回调用产生的承诺。请至少显示其中一项功能的代码。
提供了一个答案，但仍然是一个谜，为什么您的表单提交，因为您阻止默认...检查控制台是否有错误并确保在您调用此代码时表单存在

标签： jquery ajax .when

【解决方案1】：

你写错了$.when()

每个 ajax 调用 promise 都应该是一个参数（或者在 jQuery 3+ 中可以是一个 promise 数组）

$(function(){
    $('form[name="regForm"]').on('submit', function( e ) {
        e.preventDefault();

        $.when( ajaxOne(), ajaxTwo(),  ajaxThree()   
        ).done(function() {
            $('form[name="regForm"]').unbind('submit').submit();
        });
    });
});

这也假设表单选择器是正确的，并且每个 ajax 函数都返回一个 $.ajax 类似的承诺

function ajaxOne()(
  return $.ajax({...})    
}

【讨论】：

【解决方案2】：

你必须作为参数传递

$.when.apply($, arrayOfDefferds).done(doStuff);

注意获取回复。

【讨论】：