如何將刷新div的兩個腳本結合在一起？

Question

我有兩個刷新div動態的腳本：
1） http://project-welcome.ugu.pl/test/ajax.js
2） http://project-welcome.ugu.pl/test/ajax2.js

我試圖結合起來：

    // Customise those settings

    var seconds = 1;
    var divid = "timediv";
    var divid2 = "points";
    var url = "boo.php";
    var url2 = "boo2.php";

    // Refreshing the DIV

    function refreshdiv(){

    // The XMLHttpRequest object

    var xmlHttp;
    try{
    xmlHttp=new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
    }
    catch (e){
    try{
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
    }
    catch (e){
    try{
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch (e){
    alert("Your browser does not support AJAX.");
    return false;
    }
    }
    }

    // Timestamp for preventing IE caching the GET request

    fetch_unix_timestamp = function()
    {
    return parseInt(new Date().getTime().toString().substring(0, 10))
    }

    var timestamp = fetch_unix_timestamp();
    var nocacheurl = url+"?t="+timestamp;
    var nocacheurl2 = url2+"?t="+timestamp;
    // The code...

    xmlHttp.onreadystatechange=function(){
    if(xmlHttp.readyState==4){
    document.getElementById(divid).innerHTML=xmlHttp.responseText;
    document.getElementById(divid2).innerHTML=xmlHttp.responseText;
    setTimeout('refreshdiv()',seconds*1000);
    }
    }
    xmlHttp.open("GET",nocacheurl,true);
    xmlHttp.send(null);
    xmlHttp.open("GET",nocacheurl2,true);
    xmlHttp.send(null);
    }

    // Start the refreshing process

    var seconds;
    window.onload = function startrefresh(){
    setTimeout('refreshdiv()',seconds*1000);
    }

index.html的來源：

    <script src="ajax3.js"></script>
    <script type="text/javascript"><!--
    refreshdiv();
    // --></script>
    Logs<div id="timediv"></div><br>
    Points<div id="points"></div><br>

這是行不通的，因為兩個div顯示相同（在本例中為點）。

如何正確組合腳本？

Ps你可以在文件original.php中看到它
登錄：testowyuser
通過：測試
然后點擊“ StronaGłówna”

Answer 1

最后的事情和第一個重疊。

可以抱怨了；），看這里

xmlHttp.open("GET",nocacheurl,true); // opening 1st URI
xmlHttp.send(null); // requresting. in the mean time we've got the response and our `onreadystatechange` function triggers

xmlHttp.open("GET",nocacheurl2,true); // opening 2nd URI
xmlHttp.send(null); // the same situation. received response, triggered function

您正在使用1個xmlHTTP實例來請求兩者。 並順序使用它，但要求它同時工作。

因此，當函數觸發（ 第一次或第二次無關緊要 ）時，您假設（ 但不包括腳本 ）在1個變量中已經有2個響應。 此外，您希望腳本猜測您實際想要的內容。

document.getElementById(divid).innerHTML = xmlHttp.responseText; // getting response text from the current response (it can be 1st or 2nd response)
document.getElementById(divid2).innerHTML = xmlHttp.responseText; // and again getting the current response text from the same instance (not the response you are expecting from the next request). so, you are repeating the same for the another <div>

實際上，每次您只有一個回復文本。 並且每次您輸入<div's>相同的信息（在2 <div's>復制信息）bec。 尚無有關下一個請求的信息。

我想，腳本的結果是，您總是將最后一個請求復制到2個<div's> 。

嘗試為每個“通道”創建1個實例（ 要使用的第一個腳本的xmlHTTP實例1個，第二個腳本的1個實例 ），然后將它們設置為不同的（單獨的） onreadystatechange函數。 這樣，您就不會有數據重疊並且不會糾結。

更好的解決方案 （ 在JS中較少重構 ）是區分響應。 例如，如果您正在接收XML，則可以將其解析為一個標志 ，該標志將告訴您此響應用於<div id=divid> ，另一個響應用於另一個<div>或者該請求是第一個，這是第二個，等等。 。