计时器在javascript中工作

时间:2013-07-10 11:20:18

标签: javascript html

在我的项目中,我使用的是运行的计时器,单击开始按钮时单击结束时停止

当点击两次或多次启动按钮时,问题是错误的..时间需要额外+1000毫秒并且开始运行得更快..这不应该发生

我的javascript是..

<script type="text/javascript">
var sec = 0;
var min = 0;
var hour = 0;
function stopwatch(text) {
    sec++;
    if (sec == 60) {
        sec = 0;
        min = min + 1; 
    } else {
       min = min; 
    }

    if (min == 60) {
       min = 0; 
       hour += 1; 
    }
    if (sec<=9) { sec = "0" + sec; }
    document.getElementById("starttime").innerHTML = ((hour<=9) ? "0"+hour : hour) + " : " + ((min<=9) ? "0" + min : min) + " : " + sec;
    SD=window.setTimeout("stopwatch();", 1000);
}

function f3() {
    clearTimeout(SD);
}
</script>
<form name="clock">
<div id="starttime" style="font-size:large; "></div>
<input type="button" name="theButton" id="Start" value="Start"  onClick="stopwatch(this.value);" />
<input type="button" name="theButton" id="end" value="Stop"  onClick="f3();" />
</form>

我尝试过这样的事情......

  if (document.clock.theButton.value == "Start") {
            window.clearTimeout(SD);
            return true;  }`

....但它不起作用

2 个答案:

答案 0 :(得分:2)

请勿直接致电stopwatch()

调用其他内容检查SD的状态,然后调用stopwatch()

<input type="button" name="theButton" id="Start" value="Start"  onClick="startStopWatch();" />

var sec = 0;
var min = 0;
var hour = 0;
var SD;

function startStopWatch(){
    if (!SD){
      stopwatch();   
    }
}

function stopwatch() {
   sec++;
  if (sec == 60) {
   sec = 0;
   min = min + 1; }
  else {
   min = min; }
  if (min == 60) {
   min = 0; 
   hour += 1; }
if (sec<=9) { sec = "0" + sec; }
  document.getElementById("starttime").innerHTML = ((hour<=9) ? "0"+hour : hour) + " : " + ((min<=9) ? "0" + min : min) + " : " + sec;
 SD=window.setTimeout(stopwatch, 1000);
}

function f3() {
    if (SD){
       clearTimeout(SD);
    }
}

现场演示: http://jsfiddle.net/uJPff/2

答案 1 :(得分:0)

您可以这样做:

var SD;
function stopwatch(text) {
    if (SD && text) {
        return;
    }
            ....
}

function f3() {
    clearTimeout(SD);
    SD = false;
    sec = 0;
    min = 0;
    hour = 0;
}

即。您可以检查,如果单击按钮时超时已在运行,并在需要时取消执行。

您可以在更新后的jsFiddle进行测试。