1

我在快进计时器时遇到问题。在这个体育场，这是非常基本的。我有一个添加数字的间隔。像这样：

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 毫秒有效。但是有些东西不可靠，我认为最好的方法是调整时间。

4

3 回答 3

0

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

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

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

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

于 2013-01-17T07:35:34.773 回答
0

我认为您应该做的是将间隔存储在一个变量中，以便您可以清除它，并以不同的延迟重新启动它。

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();

这是一个简单的演示

于 2013-01-12T03:21:45.880 回答
0 
<!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>
于 2013-01-12T03:50:12.267 回答