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显示相同（在这种情况下是点）。

如何正确组合脚本？

P.s你可以在文件original.php中看到它登录：testowyuser
通过：testtest
然后点击“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>）时，你就可以了。没有关于下一个请求的信息。

正如您的脚本中的结果，我想，您总是在2 <div's>上复制上次请求。

尝试为每个“频道”创建1个实例（ 1个xmlHTTP实例，供第一个脚本使用，1个用于第二个）并设置它们不同的（单独的）onreadystatechange函数。这样你就不会有数据重叠，也不会纠结。

更优雅的解决方案（减少JS中的重构）是区分响应。对于例如如果你正在接收XML，你可以解析一些标志，它会告诉你这个响应是针对<div id=divid>而另一个针对的是另一个<div>或者这个请求是第一个这是第二次等。

如何将两个脚本刷新为一个？

1 个答案: