3

我希望我的页面执行相同的功能 3 次,每次调用 3 个不同的东西。

该代码目前

 <script>
 ajaxGet('/goget.php?name='+edit.dep.value, 'dep_result');
 ajaxGet('/goget.php?name='+edit.arr.value, 'arr_result');
 ajaxGet('/goget.php?type='+edit.reg.value, 'reg_result');
 </script>

但它只执行最后一次调用。为什么?

Javascript:

var XMLHttpRequestObject = false;

if (window.XMLHttpRequest) {

XMLHttpRequestObject = new XMLHttpRequest();

} else if (window.ActiveXObject) {

XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}

function ajaxGet(ajaxLoadData, changeToID) {

if(XMLHttpRequestObject) {

    var obj = document.getElementById(changeToID);
    XMLHttpRequestObject.open("GET", ajaxLoadData);
    XMLHttpRequestObject.onreadystatechange = function() {

    if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status ==     200) {

        obj.innerHTML = XMLHttpRequestObject.responseText;

    }
}

    XMLHttpRequestObject.send(null);

}
}
4

2 回答 2

3

您需要让每个调用都ajaxGet创建自己的XMLHttpRequest.

一次XMLHttpRequest只能处理 1 个请求。而且,由于它们将异步发出请求,因此它们将并行处理而不是顺序处理。

function ajaxGet(ajaxLoadData, changeToID) {
    var obj = document.getElementById(changeToID);
    var xhr = new XMLHttpRequest();

    xhr.open("GET", ajaxLoadData);
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4 && xhr.status == 200) {
            obj.innerHTML = xhr.responseText;
        }
    };
    xhr.send(null);
}

诚然,浏览器通常一次将请求限制为几个(通常是 2 个),将任何额外的请求排队。但你的代码不应该指望这一点。


旁注:除非您需要支持 IE6 或更早版本,否则您不需要回退到ActiveXObject.

于 2013-08-04T23:02:02.207 回答
0

您需要更改方法以在每次调用ajaxGet()时实例化一个新对象。XMLHttpRequest因为,您使用相同的XMLHttpRequest每个新请求都会覆盖前一个请求。

因此,您只能获得最后一个方法调用返回的结果。

function getXHRObj() {
    if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        return new ActiveXObject("Microsoft.XMLHTTP");
    }
}

function ajaxGet(ajaxLoadData, changeToID) {
    var XMLHttpRequestObject = getXHRObj();
    var obj = document.getElementById(changeToID);
    XMLHttpRequestObject.open("GET", ajaxLoadData);
    XMLHttpRequestObject.onreadystatechange = function() {
        if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200) {
            obj.innerHTML = XMLHttpRequestObject.responseText;
        }
    }
    XMLHttpRequestObject.send(null);
}
于 2013-08-04T23:05:00.920 回答