许多Ajax在同一页面中调用 - 耗时很长

Question

我正在使用Ajax很多，但是我有问题，很多次它都不起作用（它返回一个空字符串，或者只是长时间挂在服务器上而没有响应）。

如果有时可能会等待调用ajax并从服务器获取响应10秒，有时这会耗费很长时间，我可以等几分钟来运行特定的简单ajax调用。

这是我在每个ajax上放置的代码示例（有两种态度 - 我想我总是会使用jquery，但我想知道我的代码是否正常）。

代码1 :(老式）

var tout;

function testAjax1() {
    'use strict';

    var xmlhttp;

    if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {// code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
            if (tout) {
                clearTimeout(tout);
            }
            alert(xmlhttp.responseText);
            alert("success");
        }
    };

    function ajaxTimeout() {
        xmlhttp.abort();
        alert("timeout");
    }

    clearTimeout(tout);

    tout = setTimeout(function () {
        ajaxTimeout();
    }, 10000);

    xmlhttp.open("POST", "testAjax1.php", true);
    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

    xmlhttp.send("");
}

function ajax2, ajax3, ... ajax100 exists.

代码2：（jquery）：

function testAjax1() {
    'use strict';
    var s;

    $.ajax({
        url : "testAjax1.php",
        type: "POST",
        dataType: "html",
        timeout: 10000
    }).success(function (result) {
        s = result;
        alert(s);
        alert("success");
    }).fail(function (jqXHR, textStatus) {
        s = jqXHR.responseText;
        if (textStatus === "timeout") {
            alert("timeout");
        } else {
            s = jqXHR.responseText;
            alert(s);
        }
    });
}
 function ajax2, ajax3, ... ajax100 exists.

我使用了很多ajax函数调用，但是：

1. 我认为ajax1的响应是由ajax2捕获的，即

2. 出于某种原因 - 来自ajaxs函数的响应看起来耗时太长。我不知道 - 代码1和代码2。

这是html页面中jquery的主标题

（我已将jquery复制到我自己的网站中）

<link rel="stylesheet" href="./css/jquery-1.9.1-ui.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="./css/alljqfonts.css" type="text/css" media="screen">

<script src="./jquery/jquery-1.8.2.min.js"></script>
<script src="./jquery/jquery-1.9.1-ui.min.js"></script>       
<script src="./jquery/jquery.ui.touch-punch.js"></script>
<script src="./jquery/jquery.exif.js"></script>
<script src="./jquery/jquery.qtip-1.0.0-rc3.min.js"></script>
<script src="./jquery/jQueryRotate.2.2.js"></script>
<script src="./jquery/jquery.Jcrop.js"></script>
<script src="./jquery/jquery.Jcrop.min.js"></script>

可能有什么问题？

谢谢：）

Answer 1

您无法触发并行的ajax调用。每个浏览器都有不同的限制。

解决方案：

在不同的子域上触发每个ajax调用。然后可以是并行请求。