如何知道所有ajax调用何时完成

Question

我有一个带有行的表格样式页面。每行都有一个复选框。我可以选中所有/很多复选框，然后单击“提交”，这是对每一行的Jquery ajax调用。

基本上，我对每一行都有一个表单，并且遍历所有选中的行，然后提交执行jquery ajax调用的表单。

所以我有一个按钮，它可以：

       $("input:checked").parent("form").submit();

然后每一行都有：

            <form name="MyForm<%=i%>" action="javascript:processRow(<%=i%>)" method="post" style="margin:0px;">

                <input type="checkbox" name="X" value="XChecked"/>

                <input type="hidden" id="XNumber<%=i%>" name="X<%=i%>" value="<%=XNumber%>"/>

                <input type="hidden" id="XId<%=i%>" name="XId<%=i%>" value="<%=XNumber%>"/>

                <input type="hidden" id="XAmt<%=i%>" name="XAmt<%=i%>" value="<%=XAmount%>"/>

                <input type="hidden" name="X" value="rXChecked"/>

            </form>

该表格提交给processRow：

   function processRow(rowNum)

   {

        var Amount = $('#XAmt'+rowNum).val();

        var XId = $('#XId'+rowNum).val();

        var XNum = $('#OrderNumber'+rowNum).val();

        var queryString = "xAmt=" + "1.00" + "&xNumber=" + OrdNum + "&xId=" + xId;

        $('#coda_'+rowNum).removeClass("loader");

        $('#coda_'+rowNum).addClass("loading");

        $.ajax({

          url: "x.asp",

          cache: false,

          type:  "POST",

          data:  queryString,

          success: function(html){

            $('#result_'+rowNum).empty().append(html);

            $('#coda_'+rowNum).removeClass("loading");

            $('#coda_'+rowNum).addClass("loader");

          }

        });

   }

我想知道的是，通过这种方法，我可以判断出我所有的Ajax调用是否都已完成。原因是要在所有这些调用发生时启用/禁用提交按钮。

谢谢，请注意，由于应用程序的敏感性，我不得不修改变量名，因此许多变量名可能重复。

Answer 1

简单的方法最简单的方法是使用.ajaxStop()事件处理程序：$(document).ajaxStop(function() {&nbsp; // place code to be executed on completion of last outstanding ajax call here});艰难的道路您还可以手动检测是否有任何ajax调用仍处于活动状态：创建一个包含活动Ajax连接数的变量：var activeAjaxConnections = 0;在打开新的Ajax连接之前，递增该变量$.ajax({&nbsp; beforeSend: function(xhr) {&nbsp; &nbsp; activeAjaxConnections++;&nbsp; },&nbsp; url (...)在success部分检查，如果该变量等于零（如果是的话，最后的连接已完成）success: function(html){&nbsp; activeAjaxConnections--;&nbsp; $('#result_'+rowNum).empty().append(html);&nbsp; $('#coda_'+rowNum).removeClass("loading");&nbsp; $('#coda_'+rowNum).addClass("loader");&nbsp; if (0 == activeAjaxConnections) {&nbsp; &nbsp; // this was the last Ajax connection, do the thing&nbsp; }},error: function(xhr, errDesc, exception) {&nbsp; activeAjaxConnections--;&nbsp; if (0 == activeAjaxConnections) {&nbsp; &nbsp; // this was the last Ajax connection, do the thing&nbsp; }}如您所见，我还添加了检查返回错误的信息