jQuery調用堆棧？

Question

我有很多使用jQuery的相同類型的問題的實例。可能是因爲我缺少一些基本知識（jQuery newb）。在獲取數據的$ .Ajax調用中 - 取得成功：我根據返回的數據對其他函數執行了很多調用。這些電話需要按照特定的順序進行，但這似乎沒有發生。如果我有另一個我編寫的jQuery函數的調用，然後三行後面又調用另一個函數（這取決於第一個函數調用中發生的某些事件），則第二個調用將首先發生。在調試器中用兩次不同的$ .Ajax調用來設置這個調試器很多次，它就是這樣發生的。我在做一些完全錯誤的事情嗎？

順便說一句 - 數據進來很好，填充我的表格和表單項目。每個請求我下面張貼代碼 - 註釋表明GetInventory需要BuidlNav

 $(document).ready(function() { 
     $('#searchNow').css('visibility', 'hidden'); //Hide Search Now button 
     $("#popup").css("display", "none"); 
     $('#submit').prop('disabled', true); 
     $.ajax({ 
      type: "POST", 
      url: "mypage.aspx/mywebmethod", 
      contentType: "application/json; charset=utf-8", 
      data: "{}", 
      dataType: "json", 
      success: function (states) { 
       var jsonCodes = JSON.parse(states.d); 
       for (var i in jsonCodes) { 
        $("#Select0").append(new Option(jsonCodes[i].regionname, jsonCodes[i].region_id)); 
       } 
       var first = getUrlVars()["region"]; 
       if (first) { 
        debugger; 
        $.fn.SetAllSelectors(reg); 
        $.fn.GetInventory(1, 10, reg, 'rank', 'asc'); //This should happen first 
        $.fn.BuildNav(); // This depends on GetInventory having been executed already.      
       } 
       else { 
        var myText = 'United States'; 
        $("#Select0 option").filter(function() { 
         return $(this).text() == myText; 
        }).first().prop("selected", true); 
        $.fn.GetChildRegions("Select0"); 
       } 
      } 
     });   
    } 
); 

Answer 1

之前執行。如果GetInventory和BuildNav也使用AJAX，你需要一個結構更加喜歡這個。在進行ajax調用時，數據會在不保留下一個命令行的情況下獲取，因此可能會在第一個完成之前調用第二個或第三個函數。

$.ajax({  
    type: "POST", 
    url: "mypage.aspx/mywebmethod", 
    contentType: "application/json; charset=utf-8", 
    data: "{}", 
    dataType: "json", 
    success: function (states) { 
     getInventoryAndBuildNav(states); 
    }, 
    ... 
}); 

function getInventoryAndBuildNav(states){ 
    $.ajax({  
     .... 
     url: "mypage.aspx/getinventory", 
     success: function (inventory) { 

      $.fn.BuildNav(); 
     }, 
     ... 
    }); 
} 

完成此操作的最佳方法是爲每個項目構建函數並允許傳遞迴調方法。

認爲它這樣

$.ajax({  
    type: "POST", 
    url: "mypage.aspx/mywebmethod", 
    contentType: "application/json; charset=utf-8", 
    data: "{}", 
    dataType: "json", 
    success: function (states) { 
     //This will trigger second since we had to wait for the process to finish 
     alert('The Ajax call has been made, finished, and the data received'); 
    } 
}); 

//This will trigger FIRST since the ajax call was initiated, but we're still waiting 
alert('The Ajax call has been made. We're moving on to the next call.');