Question

我正在学习倒计时，我在互联网上找到了一个指南。但当页面关闭倒计时停止，如果我再次打开页面倒计时再次运行，我想让倒计时继续运行，即使页面关闭 http://jsfiddle.net/FnsY4/

function setCookie(cname,cvalue,exdays)
{
var d = new Date();
d.setTime(d.getTime()+(exdays*24*60*60*1000));
var expires = "expires="+d.toGMTString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname)
{
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) 
  {
  var c = ca[i].trim();
  if (c.indexOf(name)==0) return c.substring(name.length,c.length);
  }
return "";
}

//check existing cookie
cook=getCookie("my_cookie");

if(cook==""){
   //cookie not found, so set seconds=60
   var seconds = 60;
}else{
     seconds = cook;
     console.log(cook);
}

function secondPassed() {
    var minutes = Math.round((seconds - 30)/60);
    var remainingSeconds = seconds % 60;
    if (remainingSeconds < 10) {
        remainingSeconds = "0" + remainingSeconds; 
    }
    //store seconds to cookie
    setCookie("my_cookie",seconds,5); //here 5 is expiry days
    
    document.getElementById('countdown').innerHTML = minutes + ":" +    remainingSeconds;
    if (seconds == 0) {
        clearInterval(countdownTimer);
        document.getElementById('countdown').innerHTML = "Buzz Buzz";
    } else {    
        seconds--;
    }
}

var countdownTimer = setInterval(secondPassed, 1000);

<span id="countdown" class="timer"></span>

Answer 1

如果您希望倒计时即使关闭标签也有效，则您必须使用两个（或更多）选项重新考虑它：

您执行此服务器端，倒计时显示在客户端窗口中，但在服务器中处理
您将倒计时设置为给定日期（让我们说）16/12/2014 11:00:00 am然后为显示屏制作一些微积分。由于给定的日期是恒定的，无论倒计时将被关闭/打开多少次，它都将是真的。
一旦开始倒计时，您将结束日期时间保存到cookie，并在下次打开页面时从中恢复倒计时。

如果关闭标签，倒计时不会保持运行

1 个答案: