Javascript秒表不是从零开始

时间:2011-09-25 17:50:42

标签: javascript onclick stopwatch

我这里有一个基本的秒表,但问题是我认为它在页面加载时开始计数,而不是点击开始按钮时。同样,当您重置并重新启动时,会发生同样的问题。

<form>
    <input type="button" value="Start count!" onclick="doTimer()" />
    <input type="text" id="txt" />
    <input type="button" value="Stop count!" onclick="stopCount()" />
    <input type="button" value="Reset!" onclick="resetCount()" />
</form>

<script type="text/javascript">

var start = new Date().getTime(); 
var elapsed = '0.0'; 
var t;
var timer_is_on=0;

function timedCount() {
    var time = new Date().getTime() - start;
    elapsed = Math.floor(time / 100) / 10; 
    if(Math.round(elapsed) == elapsed) { elapsed += '.0'; } 
    document.getElementById('txt').value=elapsed;
    t=setTimeout("timedCount()",50);
}

function doTimer() {
    if (!timer_is_on) {
        timer_is_on=1;
        timedCount();
    }
}

function stopCount() {
    clearTimeout(t);
    timer_is_on=0;
}

function resetCount() {
    document.getElementById('txt').value='0.0';
    var elapsed = '0.0';
}


</script>

我已经尝试定义启动按钮的启动按钮,但到目前为止还没有取得多大成功。非常感谢任何帮助。谢谢。

2 个答案:

答案 0 :(得分:1)

您遇到的问题是,一旦页面加载,您就会记录start,而不是当用户实际点击开始按钮时。要记录用户实际点击按钮时的开始,请将doTimer功能更改为以下

function doTimer() {
  if (!timer_is_on) {
    start = new Date().getTime();
    timer_is_on=1;
    timedCount();
  }
}

答案 1 :(得分:1)

您必须在doTimer()中添加其他重置:

function doTimer() {
    if (!timer_is_on) {
        start = new Date().getTime(); 
        timer_is_on=1;
        timedCount();
    }
}

查看正在运行的版本here