是否可以在 jQuery 中进行半异步 ajax 调用？答案

【问题标题】：Is it possible to have a semi-async ajax call in jQuery?是否可以在 jQuery 中进行半异步 ajax 调用？
【发布时间】：2011-08-02 22:29:13
【问题描述】：

我正在开发一个涉及循环数组的网站，对每个元素使用 jQuery ajax 调用。这是一个简化的版本：

var myArray=new Array("El1","El2","El3","El4");
for(var i=0; i<myArray.length; i++){
     $.ajax({
         url: 'page.php?param='+myArray[i],
         success: function(data){
               //doing stuff with the data
               //this needs to complete before the loop advances
         }
     });
 }

在推进循环之前，我需要完成每个调用。我尝试设置async:false，这使循环正常工作，但这会阻止页面的其余脚本并导致很多滞后。有什么方法可以阻止循环继续进行直到调用完成，但仍然能够异步运行其他脚本？

【问题讨论】：

只需进行一次 ajax 调用。进行 n 次小型 ajax 调用效率低下
Raynos 有一个很好的观点，尽管您的业务逻辑可能需要其他方式。

标签： javascript jquery ajax asynchronous

【解决方案1】：

var idx = 0;
var urls = ["El1","El2","El3","El4"];

var doNextRequest = function() {
    $.ajax({
        url: 'page.php?param=' + urls[idx],
        success: function(data) {
            // ...
            idx++;
            if (idx < urls.length) {
                doNextRequest();
            }
        }
    });
}

doNextRequest();

【讨论】：

【解决方案2】：

如果使用Array.shift，则无需循环：

var myArray = new Array("El1", "El2", "El3", "El4");

function doRequest() {
    if (!myArray.length) return;
    var current = myArray.shift();
    $.ajax({
        url: 'page.php?param=' + current,
        success: function(data) {
            //doing stuff with the data
            doRequest();
        }
    });
}

【讨论】：

请记住，这假设您不需要在调用后将项目保留在数组中，这取决于您的需要，可能是可取的。
是的。不幸的是，我确实需要保留数组，但是 +1 因为我喜欢这个数组的简单性

【解决方案3】：

在前一个的成功处理程序中调用下一个请求。像这样的东西。（这可能是一个更优雅的结构）。

var myArray=new Array("El1","El2","El3","El4");
var i = 0;

function callAjax()
{
    $.ajax({
        url: 'page.php?param='+myArray[i],
        success: function(data){
            //doing stuff with the data
            //this needs to complete before the loop advances       

            if (i < myArray.length)
            {
                i++;
                callAjax();
            }
        }
    });
}

【讨论】：