0

我们有一个 24 小时倒计时计时器。问题是,每当刷新页面时,计时器就会重新启动。我们如何创建一个 cookie,以便它不会为同一个用户/刷新时重新启动?如果 if 降到 0 又会重新启动?

到目前为止我们有什么:

<script type = "text/javascript">
var totalSeconds;
function initiate(seconds) 
{
  totalSeconds = parseInt(seconds);
  setInterval("timeUpdate()", 1000); 
}
function timeUpdate() 
{
   var seconds = totalSeconds;
   if(seconds > 0) 
   {
          totalSeconds--; 
          var hours= Math.floor(seconds/3600);
          seconds %= 3600;
          var minutes = Math.floor(seconds/60);
          seconds %= 60;
          var timeIs = ((hours < 10) ? "0" : "") + hours + ":" + ((minutes < 10) ? "0" : "") + minutes + ":" + ((seconds < 10) ? "0" : "") + seconds;
          document.getElementById("timeLeft").innerHTML = "" + timeIs;
   }
   else 
   {
          document.getElementById("timeLeft").innerHTML = '';
          document.getElementById("message").innerHTML = '';
   }
}
initiate(24 * 60 * 60);
</script>
4

2 回答 2

0

首先,我们需要具有设置和读取 cookie 的功能。为此,请使用此答案中给出的功能How do I create and read a value from cookie?

所以,我们有两个函数createCookiesetCookie我们的代码。

现在在页面加载时设置并获取 cookie,如下所示

var
    //Get time started
    timeStarted = getCookie('timeStarted'),
    //To store total seconds left
    totalSeconds,
    //Current Time
    currentTime = parseInt(new Date()/1000),
    //Timer Length
    timerLength = 24 * 60 * 60;

if(timeStarted == "") {

    //Time not yet started. Start now.
    createCookie('timeStarted', currentTime, 365);

    //We started time just now. So, we have full timer length remaining
    totalSeconds = timerLength;

} else {

    //Calculate total seconds remaining
    totalSeconds = timerLength - (currentTime - timeStarted)%(timerLength);
}

现在初始化如下

initialize(totalSeconds);

您的两个功能都可以正常工作并保留它们。

我使用 365 天作为 cookie 期限。我们只需要开始时间。

根据您的要求更改代码。

如果您需要有关此代码的任何说明,请告诉我。

于 2013-05-16T04:41:38.923 回答
0
   document.cookie="name=" + cookievalue;
   alert("Setting Cookies : " + "name=" + cookievalue );

看这里

于 2013-05-16T04:01:31.760 回答