Question

我试图找到一种方法来跟踪成功的ajax返回使用javascript而不是jquery或其他libs。我想要做的是在触发函数时显示加载图形，并在返回所有结果时清除图形。我的函数分解输入并调用定义数量的ajax请求。

我读到没有直接的方法来做到这一点。我正在尝试设置一个函数来计算成功的请求，但我遇到了一个我无法解决的逻辑障碍。我的基本概要如下：

TIA

编辑更新解决方案。

解决方案是将ct创建为全局变量我的工作代码大纲是

var ct = 0;//declare outside of function as global


function ajaxcallback(...) { 
...
if (success)
{
//output/do something
ct++; //increase global ct by 1

countajax (total);//call countajax

}
}//end function

function countajax (total)
{
    if (ct == total)
    {
    //turn off loading graphic  
    }
}//end countajax

我认为函数countajax不是必需的，ct == total的比较可以在不调用函数countajax的情况下完成。

Answer 1

执行此操作的一种方法是保留一个跟踪您发出的请求数量的变量，以及另一个跟踪您收到的响应数量的变量。然后，在启动所有ajax调用之后，启动一个poller（setInterval），它检查响应计数变量以匹配总请求变量。

var totalRequests = 0,
    successfulRequests = 0,
    poller = null;

// psuedo code
totalRequests++;
ajax("http://server.com", function(resp){ successfulRequests++; } /** callback */);

totalRequests++;
ajax("http://server.com", function(resp){ successfulRequests++; } /** callback */);

totalRequests++;
ajax("http://server.com", function(resp){ successfulRequests++; } /** callback */);

// run poller after you've kicked off all your ajax requests
poller = window.setInterval(function(){
  if(totalRequests === successfulRequests){
    alert("all ajax finished");
    window.clearInterval(poller);
    poller = null;
  }
},100);

Answer 2

实际上有一种非常简单的方法：

从每个ajax回调中调用一个方法，并确保如果所有的ajax调用都完成，这个函数实际上只做任何事情，如下所示：

(function() {
    var ajax1_done = ajax2_done = ajax3_done = false;

    function ajax1_callback() {
      ajax1_done = true;
      run_when_all_is_done();
    }

    function ajax2_callback() {
      ajax2_done = true;
      run_when_all_is_done();
    }

    function ajax3_callback() {
      ajax3_done = true;
      run_when_all_is_done();
    }

    function run_when_all_is_done() {
      if(ajax1_done && ajax2_done && ajax3_done) {
        //do stuff here
      }
    }
})();

javascript - 跟踪成功的ajax请求/返回

2 个答案: