JS写的一段倒计时.有疑似客户端延迟现象.但......

Question

近来用JS写了一段倒计时.
但却出现了似乎是客户端延迟现象.
如果停留在倒计时页面.过一段时间刷新页面.比如本来还剩20分钟30秒.过个几分钟.十分钟的.刷新页面.显示的时间会突然少好几秒.当然.停留的时间越长.延迟现象越厉害.
检查了代码.没发现什么问题.
同样的别人站里的倒计时.我查看了一下JS.跟我的一样.但人家的就不延迟.就我的延迟.
比较纳闷儿.
哪朋友帮我瞧瞧.到底问题出在哪里了.我的步骤是这样儿的.
后台存了一个结束时间.比如"2010-10-10 00:00:00".
这个时间我存在一个静态变量里.只有第一个访问的人才从数据库加载它.
然后倒计时页面加载的时候.从静态变量里取出这个时间.跟服务器当前时间相减.得出相差的秒数.
然后把这个秒数传到JS中.开始倒计.
下面是JS代码.function msShowTime(ss,cn){
    this.sc=ss;
    this.cn=cn;
    this.s_d=$("st_d");
    this.s_h_1=$("st_h_1");
    this.s_m_1=$("st_m_1");
    this.s_s_1=$("st_s_1");
    this.s_h_2=$("st_h_2");
    this.s_m_2=$("st_m_2");
    this.s_s_2=$("st_s_2");
    this.s_b=$("s_btn");
    this.showtime=function(){
        var tm=this.sc--;
        var d,h,m,s;
        if(tm>0){
            d=parseInt(tm/86400);
            tm=tm%86400;
            h=parseInt(tm/3600);
            tm=tm%3600;
            m=parseInt(tm/60);
            s=tm%60;
            this.s_d.innerHTML=d;
            this.s_h_1.innerHTML=parseInt(h/10);
            this.s_m_1.innerHTML=parseInt(m/10)
            this.s_s_1.innerHTML=parseInt(s/10)
            this.s_h_2.innerHTML=h%10;
            this.s_m_2.innerHTML=m%10;
            this.s_s_2.innerHTML=s%10;
            setTimeout(this.cn+".showtime()",1000);
        }else{
            this.sc=WebAjaxAction.getMSTime().value;//去服务器检查时间.防止客户端非法提交
            if(this.sc<=0){
                this.s_d.innerHTML="0";
                this.s_h_1.innerHTML="0";
                this.s_m_1.innerHTML="0";
                this.s_s_1.innerHTML="0";
                this.s_h_2.innerHTML="0";
                this.s_m_2.innerHTML="0";
                this.s_s_2.innerHTML="0";
                //倒计时结束后的操作
            }else{
                this.showtime();
            }
        }
    }
}其中this.s_d\this.s_h_1\this.s_m_1........只是普通的DIV.加载页面时算出时间差.然后往页面写入:
"<script>var mst=new msShowTime(" + 时间差 + ",\"mst\");mst.showtime();</script>"朋友们帮看看....

Answer 1

忘了这句了.
var $ = function(id) {return document.getElementById(id);}

Answer 2

尽量不要用setTimeout计时，js还有一丁点儿执行时间呢，一点一点累积起来就~
最好设置一个全局变量，保存开始计时时间
d = new Date();
startTime = d.getTime();
然后把这句
var tm=this.sc--;
改为：
var tm=this.sc - ((d.getTime()-startTime)/1000);
每次新获取一个时间减去开始计时时间当做时间差

Answer 3

你的方法不可取..因为这个倒计时是以服务器的时间为准的.你用new Date取的是客户端的.这会造成很多麻烦.JS执行是需要时间.这个我知道.但同样的代码.为什么别人的站.我试过了.停留很久.再刷新也不会延迟??我很费解哇!!

Answer 4

是我表达的不清楚？起码试一下也行啊~倒计时的起始时间还是以服务器为准的，this.sc并没有改变，
只是取了客户端的 页面打开时间 到 当前时间 的 时间差，
来代替你一个一个数经过各多少个setTimeout(,1000)，
其中，setTimeout可以修改任意间隔，只影响显示间隔，不影响计时。
延迟还有一种可能是你的页面上还有跑马灯之类的JS特效。

Answer 5

临时写个简单的，自定义倒计时分钟数，间隔0.1秒，方便短时间看效果。
方法2是我说的方法。
机器慢的话运行个几十秒就能看出差距来。<script>
function msShowTime(){
//获取倒计时总时间
  djs = 600 * parseInt(d1.value);
  djs1 = djs;//用于方法1
  djs2 = djs;//用于方法2
  d = new Date();
  stratTime = d.getTime();
  showtime=function(){
   //至少到一种倒计时方法结束
   if( (djs2>0) || (djs1>0) ){
   --djs1;
   d = new Date();
   nowTime = d.getTime();
   djs2  = djs - Math.floor((nowTime - stratTime)/100);
   s1.innerHTML = djs1;
   s2.innerHTML = djs2;
   setTimeout("showtime()",100);
   }
  }
  showtime();
}
</script>
这里填个倒计时<input id="d1" type="text" value="1">分钟
<input type="button" value="开始倒计时" onclick="msShowTime();">
<div id="s1"></div>
（剩余时间，单位0.1秒——方法1）
<div id="s2"></div>
（剩余时间，单位0.1秒——方法2）

Answer 6

setTimeout("showtime()",1000);
后面的1000改小点

Answer 7

额..这个就更不可取了.哪位朋友帮看看哇...地址:http://www.hongkouzi.com/miaosha/进去之后.呆个10分钟.你刷新页面.就会看到..延时很厉害.

Answer 8

5楼朋友说的也许有点儿道理.因为我实在想不出什么原因来.大家可以打开页面.下载我的JS外部文件看看.代码是真的没有问题.不会出现这么大延时.所以我想着.会不会是左上角上下滚动显示的站内新闻和右边飘浮客服导致的.因为这两个也是settimeout..

Answer 9

能不能问下你当时是否有监控你的内存，
要知道  this.s_m_1.innerHTML=parseInt(m/10)这种操作就是在不停的开内存，
而且内存在页面刷新前是不会被释放的

Answer 10

服务器时间页面打开的时候读取一下就行了，后面到计算就全在客户端操作。
会不会是你读服务器端时间的代码有问题，alert下，看读取的时候是否正确。

Answer 11

回14楼。
你指的监控我的内存是指客户端吧？
这个没有监控.那照这个意思的话.如果客户端的机器配置不好.内存不够用的话.像这样的小JS都会受影响么?
问题是别人网站上的倒计时跟我的JS是一样一样的啊.也是settimeout.然后赋值.为什么他们的不会延迟呢?我同样做为客户端.我觉得与内存似乎没有太大的关系.
还有你指的释放内存是?CollectGarbage?
如果可以的话.能否帮我写两句.我跟你学学.回15楼。
是的.我是这样操作的.和你说的一样.只有在加载页面的时候才读取时间.然后算出来一个时间差.接下来的事情都交给JS了.读取的没有问题.现在是出现延迟.而不是一打开页面时间就不对.是打开页面.停留一会儿.时间才会延迟.这个是页面.大家帮我看看.到底是什么事情.谢谢大家了!!
http://www.hongkouzi.com/miaosha/

Answer 12

单写一个demo看看还延不延迟，settimeout会受到环境的影响，如果页面上有其他的setInterval或settimeout那是绝对会影响的。