调用相同成功函数的几个AJAX调用不起作用

时间:2013-11-25 16:12:26

标签: javascript 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;

(没有+=运营商)。

为什么日志框中的书写不符合预期?非常感谢任何帮助!

1 个答案:

答案 0 :(得分:1)

你可以在for循环中同步调用ajax然后它将逐个执行,并像往常一样在你的代码中使用这段代码。

这是同步的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;
        }
    });