Javascript，ajax計時問題

Question

我在調用2個獨立的ajax函數時遇到問題。 我有一個循環，循環瀏覽頁面上的所有復選框元素，然后如果選中它們，則會調用ajax函數來移動數據庫中的某些數據。 然后在for循環之外，我調用另一個ajax函數，該函數進入我的數據庫並將結果拉回到我的ID元素。 我不得不以不同的方式命名我的httprequests，這樣它們就不會發生沖突。這兩個函數都起作用，但是循環外的那個函數運行很快，並且不會提取新的/更改的數據。 如果我在此外部循環功能之前發出警報，則它將起作用。 我也嘗試過使用setTimeout（myFunctio（），3000），但沒有運氣。

這是我的代碼。

    function ungroupContact(){
    group = document.getElementsByName("moveGroup")[0].value;
    for(i=0;i<=25;i++){
        if(document.getElementById('checkBox'+i)){
            if(document.getElementById('checkBox'+i).checked){
                var email = document.getElementById('checkBox'+i).value;
                moveContact(email, group);
            }
        }
    }
    //alert("hello");
    //setTimeout(alert("hello"),12000);
    groupList1(group);
}

這是我的第一次發布，很抱歉，如果這很討厭，目前正在研究我的計算機科學學位。

感謝您的任何建議和/或幫助

抱歉，我應該知道安裝ajax函數。 我使用了w3schools的布局。

   function moveContact(email, group){
    if (email=="" || group=="") 
      {
      document.getElementById("sidebar2").innerHTML="Something wrong was entered";
      return;
      } 
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp1=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp1=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp1.onreadystatechange=function()
      {
    if (xmlhttp1.readyState==1 || xmlhttp1.readyState==2 || xmlhttp1.readyState==3)
        {
        document.getElementById("sidebar2").innerHTML="<img src='images/loading.gif' alt='Loading'> ";
        }

      if (xmlhttp1.readyState==4 && xmlhttp1.status==200)
        {
        document.getElementById("sidebar2").innerHTML=xmlhttp1.responseText;
        }
      }
    xmlhttp1.open("GET","core/moveContact.php?group="+group+"&email="+email,true);
    xmlhttp1.send();
    return;
}

Answer 1

您將需要跟蹤最后一個moveContact()異步ajax函數何時完成，然后（並且僅在此之后）調用groupList1() 。

由於您尚未公開可能執行ajax調用的moveContact()代碼，因此我們無法真正建議您跟蹤它們的細節。 一種簡單的技術是設置一個未決ajax調用的計數器，並在每個成功處理程序中的moveContact() ajax調用中，檢查該計數器是否現在達到零。 如果是這樣，則可以調用groupList1(group) 。

假設您將完成回調添加到moveContact() ，則可以這樣進行：

function ungroupContact(){
    group = document.getElementsByName("moveGroup")[0].value;
    var contactsRemaining = 0;
    for(i=0;i<=25;i++){
        if(document.getElementById('checkBox'+i)){
            if(document.getElementById('checkBox'+i).checked){
                ++contactsRemaining;
                var email = document.getElementById('checkBox'+i).value;
                moveContact(email, group, function() {
                    --contactsRemaining;
                    if (contactsRemaining === 0) {
                        groupList1(group);
                    }
                });
            }
        }
    }
}


function moveContact(email, group, fn){
    if (email=="" || group=="") {
      document.getElementById("sidebar2").innerHTML="Something wrong was entered";
      return;
    } 
    if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp1=new XMLHttpRequest();
    } else  {// code for IE6, IE5
        xmlhttp1=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp1.onreadystatechange=function() {
        if (xmlhttp1.readyState==1 || xmlhttp1.readyState==2 || xmlhttp1.readyState==3) {
            document.getElementById("sidebar2").innerHTML="<img src='images/loading.gif' alt='Loading'> ";
        }

        if (xmlhttp1.readyState==4 && xmlhttp1.status==200) {
            document.getElementById("sidebar2").innerHTML=xmlhttp1.responseText;
            // we are done now, so call the finish callback
            if (fn) {
               fn();
            }
        }
      }
    xmlhttp1.open("GET","core/moveContact.php?group="+group+"&email="+email,true);
    xmlhttp1.send();
    return;
}

Answer 2

您可以添加成功的回調函數，並在所有方法完成執行后在該函數中執行groupList1函數：

var finished = 0;
moveContact(email, group, function() {
   if (++finished == 25) {
       groupList1(group);
   }
});