Jquery each 在ajax $.post 之后不继续答案

【问题标题】：Jquery each not continuing after ajax $.postJquery each 在ajax $.post 之后不继续
【发布时间】：2018-02-27 23:29:55
【问题描述】：

在加载 ajax 请求之前，我的每个 jQuery 似乎都停止了。我认为 ajax 是异步的，这里有什么问题？

代码：

$('div').each(function(){

    if($(this).attr('id')){
        var that = this;
        $.post('application/views/dashboard/dashboard.php?component='+$(this).attr('id')+"&settingid="+settingId, function(response){
            $(that).html(response);
            $(window).trigger('resize');
        });
        settingId++;
    }
});

【问题讨论】：

同时通话数量有限制。您要发送多少个？
@TrueBlueAussie 4 但第二个调用速度较慢，然后它不会执行调用 3 和 4
你需要并行还是顺序运行，还是“不管，什么时候都完成就告诉我”？
好吧，我只是希望将响应放置在一个 div 中，当 1 个响应花费较长时间时，div html 正在加载...但是如果一个响应需要很长时间才能加载每个停止并等待跨度>

标签： javascript jquery ajax

【解决方案1】：

$.when 将等待所有异步调用完成（顺序和时间不重要），然后可以在最后执行单个额外操作（除了单个操作之外）。您将需要使用$.ajax 而不是更简单的$.post：

var requests = [];
$('div').each(function () {
    if ($(this).attr('id')) {
        var that = this;
        requests.push($.ajax({
            url: 'application/views/dashboard/dashboard.php?component=' + $(this).attr('id') + "&settingid=" + settingId,
            type: "post",
            success: function (response) {
                $(that).html(response);
            }
        }));
    });
    settingId++;
});
$when(requests).then(function () {
    $(window).trigger('resize');
});

$.when 的工作原理是获取一组 jQuery 承诺（在本例中为 ajax 承诺）并等待它们全部成功。

对上述代码中的任何拼写错误表示歉意。我刚才写的是直接进入答案:)

您当然可以从此简化代码：

$('div').each(function () {
    if ($(this).attr('id')) {

到这里：

$('div[id]').each(function () {

【讨论】：

等我修复一些 {}() 错误，我会尝试一下
嗯，如果请求 2 正在加载 3 并且 4 没有被执行，那么仍然会得到相同的结果。如果 2 已加载 3 和 4 将执行。
您的浏览器一次只处理 2 个请求（最大），因此这是意料之中的。您希望 4 个结果如何处理？
它们显示在表格中
一次不能超过 2 个。您可以更改优先级/顺序，或使它们全部按顺序加载，但不要一次加载全部 4 个。如果您只在所有加载结束时显示所有 4 个结果会有所帮助吗？

【解决方案2】：

看看here 和here。这是两种不同的解决方案。

这只是重写你所有的回复。尝试将它们存储在数组中，或使用 async: false，这会使您的所有请求都在队列中工作。

【讨论】：

永远不要建议 async: false 作为解决方案！这是一个非常糟糕的主意，导致的问题远远多于它解决的问题。
我同意这一点，但这是可能的解决方案之一，有时它会起作用。
始终最好找出问题的实际原因。 Anything 是比async: false 更好的解决方案。不过，您的第一个链接是一个很好的答案。
@TrueBlueAussie 你提到过“不同”这个词吗？

【解决方案3】：

使用 $.ajax() 代替 $.post。因为，它有很多可配置的参数。在这里你可以使用 Promise 模式。

【讨论】：