0

我正在研究 Rails 并编写了用于显示从 00:00:00 开始的计时器的 javascript 代码。

[注意：我有两个按钮启动和停止用于启动计时器和停止计时器]

    功能计时器（）{
    var 秒、分、小时；
    秒=0；
    最小=0；
    小时=0；

    秒++；

    如果（秒>=60）{
    分钟++；
    秒=0；
    }

    如果（分钟> = 60）{
    小时++；
    最小=0；
    }

    document.getElementById("hrs").innerHTML=hrs;
    document.getElementById("min").innerHTML=min;
    document.getElementById("sec").innerHTML=sec;

    设置超时（定时器（），1000）；
    }

现在这在我的 Rails Web 应用程序中运行良好。但是，如果我将重定向到另一个页面并返回到此页面，我将丢失计时器值。

在这里，我希望时钟在页面重定向后也能连续运行。

如何解决这个问题？

4

4 回答 4

1

获取时间戳...将其保存在某处并将其作为变量传递到下一页

var start=new Date().getTime();

让时间过去

var currentMillisecondsPassed=new Date().getTime()-start;

将其转换为hh:mm:ss.msec或其他...

下一页只需要该start值，并且有很多方法可以传递它.. php,js,get,post....等等。

setTimeout()对于计时器也不精确。

这是一个使用查询字符串传递值的示例。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>timer</title>
<script>
window.onload=function(){
 var pt=window.location.search.split('=')[1],
 e=document.body.childNodes,
 t=e[0],
 s=(pt*1||0),
 interval,
 ms2Time=function(a) {
  var ms=parseInt((a%1000)/100),
  s=parseInt((a/1000)%60),
  m=parseInt((a/(1000*60))%60),
  h=parseInt((a/(1000*60*60))%24);
  return (h<10?'0'+h:h)+':'+(m<10?'0'+m:m)+':'+(s<10?'0'+s:s)+'.'+ms;
 },
 Start=function(){
  s=new Date().getTime();
  interval=window.setInterval(getcurrent,100);
 },
 Stop=function(){
  window.clearInterval(interval);
  s=0;
 },
 getcurrent=function(){
  t.textContent=ms2Time(new Date().getTime()-s);
 },
 changepage=function(){
  window.location='?start='+s;
 };
 e[1].addEventListener('click',Start,false);
 e[2].addEventListener('click',Stop,false);
 e[3].addEventListener('click',changepage,false);
 if(pt&&pt!=0){
  interval=window.setInterval(getcurrent,100);
 }
}
</script>
</head>
<body><div id="timer"></div><button>start</button><button>stop</button><button>anotherpage</button></body>
</html>

正如我所说...您可以将起始值存储在任何地方...所以如果您有任何偏好...请告诉我，我可以为您更改代码。

于 2013-07-24T13:20:13.087 回答
1

因为您正在重定向，所以 java 脚本计时器不会做。您应该改用系统时间。您可以在从页面重定向时从会话变量中获取一些帮助，以保存计时器启动时的时间戳。

于 2013-07-24T13:17:14.953 回答
0

sec, min, hour您可以使用会话或 cookie设置变量的初始值。并将此文件包含在您希望计时器应在后台运行的所有页面中。

function timer(){

sec++;

if(sec>=60){
min++;
sec=0;
}

if(min>=60){
hrs++;
min=0;
}

setTimeout(timer(), 1000);
}

并且仅在您显示计时器的页面中将值添加到 DOM。

于 2013-07-24T13:19:18.003 回答
-1

尝试从服务器发送默认的sec、min和hrs值，例如将它们保存在 coockie 中。

于 2013-07-24T13:18:24.820 回答