javascript - 两个不同 div 中的两个 ajax 调用

Question

我想做的是进行两次ajax调用，并使每个结果显示在同一页面的两个不同div中。

这是我的 JavaScript 代码:

function firstLoad(){
    firstDiv(datedisplay.value);//populating first div
    secondDiv(datedisplay.value);//populating second div
}

function loadXMLDoc(url,cfunc){
    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=cfunc;
    xmlhttp.open("GET",url,true);
    xmlhttp.send();
}
function firstDiv(changed_date){
    var divided_date = changed_date.split("-");
    loadXMLDoc("getmonth.php?m="+divided_date[0]+"&y="+divided_date[1],function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("timetableview").innerHTML=xmlhttp.responseText;
        }
    });
}
function secondDiv(changed_date){
    var divided_date = changed_date.split("-");
        loadXMLDoc("getmonthexp.php?m="+divided_date[0]+"&y="+divided_date[1],function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("expensesview").innerHTML=xmlhttp.responseText;
        }
    });
}

响应内容是正确的，但是现在发生的是: 第二个 div 已正确填充。 第一个 div 保持空白，如果我不断刷新页面，最终第二个 div 的内容也会显示在第一个 div 中(奇怪)。

希望大家能够帮助我。

Answer 1

xmlhttp 是全局的，因为您不使用 var 关键字。这意味着您使用的 onreadystatechange 函数将覆盖另一个函数。

function loadXMLDoc(url, cfunc) {
    var xmlhttp;