幾個AJAX調用調用相同的成功功能不起作用

我對這個AJAX調用的行爲有個疑問，下面顯示了我不明白的地方。幾個AJAX調用調用相同的成功功能不起作用

var checkBoxes = document.getElementsByName("newInclCheckBox"); 
for(var i = 0; i<checkBoxes.length; i++ 
{ 
    if(checkBoxes[i].checked) 
    { 
    var name2 = getTabKeyFromDescription(checkBoxes[i].value); 
    var tablenr2 = checkBoxes[i].getAttribute("data-tablenr"); 
    var xmlhttp = new XMLHttpRequest(); 
    xmlhttp.onreadystatechange = function() 
    { 
     if(xmlhttp.readyState == 4 && xmlhttp.status == 200) 
     { 

     document.getElementById('newIncl_LogBox').innerHTML += xmlhttp.responseText; 

     } 
    } 
    xmlhttp.open("GET", "../PHPScripts/getInclusions.php?q=add&name1=" + name1 + "&tablenr1=" + tablenr1 + "&name2=" + name2 + "&tablenr2=" + tablenr2, true); 
    xmlhttp.send(); 
    } 
}

正如你所看到的，AJAX調用是一個for循環中，並同時通過checkBoxes循環被多次調用。

PHP-Skript getInclusions.php成功完成每個請求，但不知何故，只有最後一個xmlhttp.responseText被寫入我的LogBox中。

我會理解這種行爲，如果我寫了

document.getElementById('newIncl_LogBox').innerHTML = xmlhttp.responseText;

（不+=運營商）。

爲什麼在日誌框中寫入不符合預期？任何幫助是極大的讚賞！

來源

2013-11-25 Jbartmann

[for循環一個JavaScript內部異步處理]的可能重複（http://stackoverflow.com/questions/11488014/asynchronous-process-inside-a-javascript-for-loop），或請參閱http： //stackoverflow.com/questions/4288759/asynchronous-for-cycle-in-javascript或http://stackoverflow.com/questions/13343340/calling-an-asynchronous-function-within-a-for-loop-in- javascript或搜索「異步循環javascript」。 – Matt

確保您從服務器獲取每個ajax調用的HTML內容。我在for循環中看到語法問題。（var i = 0; i

缺少的括號似乎是一個打字錯誤。代碼我對它:) – Jbartmann

您可以在for循環中同步調用ajax，然後它將像這樣一個接一個地執行，並像往常一樣在代碼中使用此代碼。

這是syncronous ajax調用示例。

urllink="../PHPScripts/getInclusions.php?q=add&name1=" + name1 + "&tablenr1=" + tablenr1 + "&name2=" + name2 + "&tablenr2=" + tablenr2; 

$.ajax({ 
    async: "false", 
     type: "GET", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     url: urllink, 
     success: function(jsonData) { 
      alert("jsonData =" + jsonData); 
      return jsonData; 
     } 
    });

來源

2013-11-25 16:52:19

謝謝！即使我不使用JQuery，將異步設置爲false也可以完成這項工作。對於任何面臨相同問題的人： http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp – Jbartmann

幾個AJAX調用調用相同的成功功能不起作用

回答

相關問題