Question

我在快速转发计时器方面遇到了麻烦。这个体育场非常基础。我有一个添加数字的间隔。像这样：

setInterval(function () {
    //+1 second
    //Format output to 00:00
    //Handle minute update
}, 1000);

这很完美。计时器正常速度。我想要做的是快速转发此计时器。我想要一个计时器分钟需要1秒。我试过了：

setInterval(function () {
    //+1 second
    //Format output to 00:00
    //Handle minute update
}, 15);

有时有效，有时无效。有时它会在01:02而不是01:00停止。这可能是我缺乏数学知识，但我不知道。你会怎么做？我将在每个“计时器分钟”停止并启动计时器，因此间隔是正确的非常重要。

修改以下是我希望它如何工作的小提琴：http://jsfiddle.net/tbleckert/pF4gs/

编辑2 也许我应该调整停止计时器的时间？

编辑3 大多数时候似乎15毫秒都有效。但是有些东西让人觉得不可靠，我认为最好的方法就是调整时间。

Answer 1

我认为你应该做的是将你的间隔存储在变量中，以便你可以清除它，然后以不同的延迟再次启动它。

var delay = 1000; // JavaScript uses milliseconds, so 1000 = 1 second
var theTimer  = '';

function startTimer(){
  theTimer = setInterval(function () {
     // Do awesome stuff here
  }, delay);
}

startTimer();

现在，当您想要更改间隔或快进定时器时，您所要做的就是清除当前setInterval并再次定义 -

clearInterval(theTimer); // stop and clear the current timer
delay = 500; // Crank it up to twice the speed! 0.5 seconds!
startTimer(); // start a new setInterval();

Here is a simple demo

Answer 2

<!DOCTYPE html>
<html>
<head>
<script>
function myTimer(){
    this.startTime=0;
    this.intervalID=0;
    this.timePassed=0;
    this.multiplier=1;
    this.outputElement=null;
    this.start=function(){
        clearInterval(this.intervalID);
        this.timePassed=0;
        this.outputElement=document.getElementById("output");
        this.startTime=new Date();
        var me = this;
        this.intervalID=setInterval(function(){
            me.update(me);
        },100);
    }
    this.toTwoDigit=function(num){
        if(num<10){
            return "0"+num;
        }
        return new String(num);
    }
    this.toThreeDigit=function(num){
        if(num<10){
            return "00"+num;
        }
        if(num<100){
            return "0"+num;
        }
        return new String(num);
    }
    this.update=function(me){
        me.timePassed=me.timePassed+(100*me.multiplier);
        var seconds=Math.floor(me.timePassed/1000);
        var hours = Math.floor(seconds/3600);
        var minutes = seconds-(hours*3600);
        seconds = seconds%60;
        minutes=Math.floor(minutes/60);
        me.outputElement.innerHTML= me.toTwoDigit(hours)+":"
            +me.toTwoDigit(minutes)+":"
            +me.toTwoDigit(seconds)
            +":"+me.toThreeDigit(Math.floor(me.timePassed%1000));
    }
    this.speedup=function(){
        this.multiplier=this.multiplier*2;
    }
    this.slowDown=function(){
        this.multiplier=this.multiplier/2;
    }
    this.stop=function(){
        clearInterval(this.intervalID);
        this.update(this);
    }
}
var t = new myTimer();
</script>
</head>
<body onload="t.start();">
<input type="button" value="speed up" onclick="t.speedup()"></input>
<input type="button" value="slow down" onclick="t.slowDown()"></input>
<input type="button" value="stop" onclick="t.stop()"></input>
<input type="button" value="restart" onclick="t.start()"></input>
<input type="button" value="(re)start times 60" onclick="t.multiplier=60;t.start()"></input>
<div id="output"></div>
</body>
</html>

Answer 3

好的，我会自己回答这个问题。我认为我不够清楚。当我启动计时器时，超时同时开始，一秒钟后停止计时器。这是出错的地方，计时器在停止时并不总是显示01:00。

所以，最终的解决方案是每次停止时将秒设置为00，因为一切都发生得太快，你不会注意到。

setTimeout(function () {
  clearInterval(interval);
  $('.clock').html(rMin.slice(-2) + ':00');
}, 1000);

检查我的更新小提琴： http://jsfiddle.net/tbleckert/pF4gs/2/

快进计时器

3 个答案:

Here is a simple demo