Question

我有一张大桌子，我的优化程序的想法是逐个获取信息，并在信息到达时更新表格。

为此，我使用ajax调用php文件，该文件从数据库中收集数据。我试图逐个发送和接收数据：

 for (var i = depF; i <= depT; i++) {
        xmlhttp.open("GET", "../../php_includes/reports/InventoryReportPage.php?date=" + arguments[0] + "&depF=" + i + "&depT=" + i + "&subT=" + subT + "&subF=" + subF + "&catT=" + catT
                + "&catF=" + catF + "&Tar=" + Tar, true);
        xmlhttp.send();
        console.log("sent ajax");
    }

此代码将正确发送2个ajax调用（在浏览器中我可以看到两个＆＃34;发送ajax＆＃34;）。然而在接收器中：

xmlhttp.onreadystatechange = function()
    {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200)
        {
            console.log("recieved");
            if (xmlhttp.responseText) {
                var table = document.getElementById("inventoryReport");
                table.innerHTML += xmlhttp.responseText;
            }
        }
    }

我只看到一个返回值。知道我是否甚至被允许使用像这样的ajax调用？

整个功能：

var isClicked = false;
function onClick(date, depF, depT, subF, subT, catT, catF, Tar) {
//alert(date+ depF+ depT+ subF+ subT+ catT+ catF+ Tar)
// return null;
if (!isClicked) {
    console.log("in the function");
    var clicked = arguments[0];
    isClicked = true;
    var div = clicked + "apDiv";
    var browserSupport = (navigator.userAgent.indexOf('Firefox') != -1) || ((navigator.userAgent.indexOf('Chrome') != -1) || (navigator.userAgent.indexOf('Safari') != -1));
    if (browserSupport) {

        var xmlhttp = new XMLHttpRequest();
    }
    else {
        var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

    }
    if (!xmlhttp) {
        alert("your browser doens't supposrt XMLHTTP " + navigator.userAgent);
    }
    xmlhttp.onreadystatechange = function()
    {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200)
        {
            console.log("recieved: "+xmlhttp.responseText);
            if (xmlhttp.responseText) {
                var table = document.getElementById("inventoryReport");
                table.innerHTML += xmlhttp.responseText;
            }
        }
    }
    for (var i = depF; i <= depT; i++) {
        xmlhttp.open("GET", "../../php_includes/reports/InventoryReportPage.php?date=" + arguments[0] + "&depF=" + arguments[1] + "&depT=" + arguments[2] + "&subT=" + subT + "&subF=" + subF + "&catT=" + catT
                + "&catF=" + catF + "&Tar=" + Tar, true);
        xmlhttp.send();
        console.log("sent the ajax");
    }
}
}

Answer 1

您的代码无法正常工作的原因是您基本上会覆盖您正在执行的请求。你可以尝试这样的事情：

var reqs = [];

for (var i = depF; i <= depT; i++) {
  var xmlhttp = new XMLHttpRequest();
      xmlhttp.open("GET", "/", true);
      xmlhttp.send();

      reqs.push(xmlhttp);
}

reqs.forEach(function(req) {
  req.onreadystatechange = function()
    {
        if (req.readyState === 4 && req.status === 200)
        {
            console.log("recieved");
            if (req.responseText) {
                var table = document.getElementById("inventoryReport");
                table.innerHTML += req.responseText;
            }
        }
    }
})

将多个ajax调用发送到同一个文件

1 个答案: