在 ajax 中调用另一个 ajax 直到第一个完成答案

【问题标题】：Call another ajax inside ajax till first will complete在 ajax 中调用另一个 ajax 直到第一个完成
【发布时间】：2015-07-13 18:28:48
【问题描述】：

我正在使用 jquery ajax 在我的 web 中执行一些操作。我想每隔几秒钟调用另一个 ajax，直到第一个 ajax 响应到来。我的 ajax 代码是：-

$.ajax({
                    url  : $(this).attr('action'),
                    type    : $(this).attr('method'),
                    dataType: 'json',
                    data    : $(this).serialize(),
                    beforeSend: function() {
                            var row = '<tr id="row_'+i+'">';
                            row += '<td>'+$('#fileid').val()+'</td>';       
                            row += '<td>'+$('#resolution').val()+'</td>';       
                            row += '<td>'+$('#bitrate').val()+'</td>';      
                            row += '<td>'+$('#ndrive').val()+'</td>';       
                            row += '<td>'+$('.type').val()+'</td>';     
                            row += '<td>'+curr_date+'-'+curr_month+'-'+curr_year+'</td>';
                            row += '<td>'+hours+':'+minute+':'+second+'</td>';
                            row += '<td><div id="process-bar" class="process-bar" style="height: 18px;"> </div></td>';
                            row += '</tr>';     
                            $('#stastistics tbody').prepend(row);       
                            $('#fileid').val('');
                            $('#ndrive').val('');
                            $('.type').val('');
                            $('#resolution').val('');
                            $('#bitrate').val('');
                    },
                    success : function(data) 
                    {
                        if(data.status == 'error')
                        {
                            var html = '<span class="label label-danger">Error</span>';
                            $("tr#row_"+i+" td:nth-child(8)").find('#process-bar').remove();
                            $("tr#row_"+i+" td:nth-child(8)").html(html);
                        }
                        else if(data.status == 'success')
                        {
                            var html = '<span class="label label-success">Success</span>';
                            $("tr#row_"+i+" td:nth-child(8)").find('#process-bar').remove();
                            $("tr#row_"+i+" td:nth-child(8)").html(html);
                        }
                    },
                    error   : function( xhr, err ) 
                    {

                    },
                });

这是 ajax 需要很长时间才能完成，所以我想展示这个过程的进展。所以我想每秒调用另一个 ajax，以便它每秒更新进度数据。在第一个 ajax 响应之前，我如何在这个 ajax 中调用另一个 ajax。感谢您的帮助。

【问题讨论】：

标签： jquery ajax

【解决方案1】：

我会这样做：

var progressUpdater = setInterval(function()
{
    $.ajax({
        url: addressToProgressEndpoint,
        method: METHOD
    })
    .done(function(data)
    {
        //update UI with progress 
    });
}, 1000);

在成功回调中的原始 ajax 请求中，在 progressUpdater 上调用 clearInterval() 以停止它

【讨论】：

如何在我的 ajax 中调用这个函数。你能告诉我细节吗。我不知道如何使用我的 ajax 调整此代码。 @iismathwizard
@GiteshPurbia 你应该能够在你的代码中实现它。这是 stackoverflow.com 不是 writemycodeforme.com 。在原始 ajax 调用的成功函数中，只需添加 clearInterval(progressUpdater) 并在执行该 ajax 调用之前，添加我的部分。我不会向您展示如何使用数字更新 UI。
@GiteshPurbia 如果它解决了您的问题，请点赞并将其标记为已接受，以便其他人可以快速了解解决方案。