1

好，

我有一个倒数计时器，我面临以下问题：

我的倒计时从 90 秒开始。例如，如果用户等到 2 秒，然后他使用浏览器的按钮返回，然后继续前进（返回到同一页面），倒计时在 90 秒重新开始，而不是我需要的 2 秒，因为当计时器达到 0 我“点击”了一个发布表单的按钮。

我知道我需要处理后退和前进按钮并使用新值设置我的变量，但我不知道该怎么做。任何帮助都会很棒。

我的代码如下：

var count = 90;
var screenCount = count;
var newCount = 0;
function countFunction() {

    if (screenCount != 0) {
    var minutes = Math.floor(count / 60);
    var seconds = count - minutes * 60;        
    if (count > 60){
        if (seconds < 10)
            seconds = "0" + seconds;
        screen = minutes + "m:" + seconds + "s";
        $('.timer').css('width',"120px")
    }
    else{            
        if (count < 10)
            screen = "0" + count;
        else
            screen = count + "s";            
        $('.timer').css('width',"60px")
    }
    document.getElementById('tempo').innerHTML = screen;
    if (count == 0) {
         set('temporizador', screenCount);
          $(":submit").removeAttr("disabled");
        $('#responder').click(); 

    }
    if (count != 0) {
         set('temporizador',screenCount - count );
        count = count - 1;
        setTimeout("countFunction()", 1000);
    }
    } 
    else {
        document.getElementById('tempo').innerHTML = '∞';

        set('temporizador', newCount);

         newCount++;
        setTimeout("countFunction()", 1000);
    }

}
4

3 回答 3

2

当用户按下一个全新的页面时，会加载一个全新的 Javascript 上下文。如果您想将信息从一个页面的上下文传递到另一个页面的上下文，有几种方法可以做到这一点。

在您的特定情况下，使用 LocalStorage 是最简单的：

// count down 90 seconds, including page navigation on this site
var count = +localStorage.getItem('timerCount') || 90;

function countDown() {
  count--;
  localStorage.setItem('timerCount', count);
  if (count<0) window.clearInterval(myInterval);
}

var myInterval = window.setInterval(countDown, 1000);

@DmitryVolokh 的建议

在此示例中，我将剩余时间存储在 localStorage 中。如果您想跟踪特定时刻的经过时间，最好存储开始时间并计算差异。

于 2013-11-12T14:27:44.987 回答
1

您可以按照上面的建议使用本地存储，但存在一些旧浏览器不支持 localStorage 的小问题：http: //caniuse.com/#search=local%20storage

由于您只存储一个数字，您还可以使用 cookie：

var match, count;
if (match = /timerCount=(\d+);/.exec(document.cookie)) {
  count = match[1];
} else {
  count = 90
}

function countDown() {
  count--;
  document.cookie = 'timerCount=' + count + ';';
  if (count<0) window.clearInterval(myInterval);
}

var myInterval = window.setInterval(countDown, 1000);
于 2013-11-12T14:41:59.360 回答
0

您可以使用onbeforeunload javascript 事件来查看用户何时离开页面，然后根据需要执行操作：更改 window.location 以重定向用户（并提供其他参数，例如您的计时器），或阻止他离开页面。您还可以创建一个cookie或使用localstorage来存储计时器，并在下次用户访问您的页面时将其取回。

于 2013-11-12T14:33:13.090 回答