一鍵點擊兩個函數

Question

我試圖在兩個不同的DIV中加載兩個不同的文件。下面是我使用

var please_wait = null; 
function open_url(url, target) { 
    if (!document.getElementById) { 
     return false; 
    } 
    if (please_wait != null) { 
     document.getElementById("target").innerHTML = please_wait; 
    } 
    if (window.ActiveXObject) { 
     link = new ActiveXObject("Microsoft.XMLHTTP"); 
    } else if (window.XMLHttpRequest) { 
     link = new XMLHttpRequest(); 
    } 
    if (link == undefined) { 
     return false; 
    } 
    link.onreadystatechange = function() { 
     response(url, target); 
    } 
    link.open("GET", url, true); 
    link.send(null); 
} 
function response(url, target) { 
    if (link.readyState == 4) { 
     document.getElementById(target).innerHTML = (link.status == 200) ? link.responseText : "Ooops!! A broken link! Please contact the webmaster of this website and give him the following errorcode: " + link.status; 
    } 
} 
function set_loading_message(msg) { 
    please_wait = Loding; 
} 

和我使用這個代碼的鏈接調用的代碼...

<a href="javascript:void(0)" onclick="open_url('firstpage.php','containerA');open_url('secondpage.php','containerB')"> Click Here </a> 

它只是在加載概情況下，後一個。我嘗試了不同的東西，完全採用了兩種不同的方法，例如open_url2，但沒有用。它一次只能在DIV中加載一個請求。任何解決方案

Answer 1

你正在做很多額外的工作，使用舊學校ajax調用。我認爲你會用jQuery ajax方法獲得更好的運氣。

至於爲什麼後者被加載，你檢查了螢火蟲或其他網絡工具，看看這兩個文件是否得到加載？ 如果它們都被加載，我相信可能發生的後果是用你正在使用的.innerHTML函數覆蓋第一個函數。你想追加。看看這些鏈接，用jQuery做要容易得多：

Making Ajax calls

Appending to an element

Answer 2

你似乎是使用link爲全局變量。因此第二次撥打open_url()將覆蓋從第一個創建的值link。

您應該將其設置爲open_url()函數的本地值，並將其傳遞給response()函數。

var please_wait = null; 
function open_url(url, target) { 

     // v----declare the variable 
    var link; 
    if (!document.getElementById) { 
     return false; 
    } 
    if (please_wait != null) { 
      // ----------------------v---"target" is a String??? 
     document.getElementById("target").innerHTML = please_wait; 
    } 
    if (window.ActiveXObject) { 
     link = new ActiveXObject("Microsoft.XMLHTTP"); 
    } else if (window.XMLHttpRequest) { 
     link = new XMLHttpRequest(); 
    } 
    if (link == undefined) { 
     return false; 
    } 
    link.onreadystatechange = function() { 
     response(url, target, link); // <-- pass "link" to the response 
    } 
    link.open("GET", url, true); 
    link.send(null); 
} 

    // receive "link"-------------v----so that you have the correct xhr object 
function response(url, target, link) { 
    if (link.readyState == 4) { 
     document.getElementById(target).innerHTML = (link.status == 200) ? link.responseText : "Ooops!! A broken link! Please contact the webmaster of this website and give him the following errorcode: " + link.status; 
    } 
} 
function set_loading_message(msg) { 
    please_wait = Loding; 
} 

Answer 3

如前所述，您對AJAX有爭議。

這裏是你的代碼如何能期待在jQuery的

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"</script> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#link1").click(function() { 
    $("#containerA').load("firstpage.php",function() { 
     $("#containerB').load("secondpage.php"); 
    }); 
    }); 
}); 
</script> 

<a id="link1" href="#"> Click Here </a> 

或者使用一個隊列管理器的jQuery插件