如何将刷新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>或者该请求是第一个，这是第二个，等等。 。