如何解决计时器中点击一次增加1s问题

源自：8-6 取消计时器clearTimeout()

如何解决计时器中点击一次增加1s问题

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>

<script type="text/javascript">
  var num=0;
  var i;
  function startCount(){
     clearTimeout(i); 
    document.getElementById('count').value=num;
    num=num+1;
    i=setTimeout("startCount()",1000);
  }
  
  function stopCount(){
    clearTimeout(i);
  }
</script>
</head>
<body>
  <form>
    <input type="text" id="count" />
    <input type="button" value="Start" onclick="startCount()" />
    <input type="button" value="Stop"   onclick="stopCount()"/>
  </form>
</body>
</html>

虽然增加了clearTimeout(i);以后解决了数字飙升的问题，但是还存在点一次增加1的问题，有没有大神能解决这个问题？

提问者：Jiuppo 2017-06-29 00:06

个回答

无冕之王: 2017-06-29 11:03:44

已采纳

你的startCount（）函数有问题啊，正确的如下，你的cleanTimeout(i)了.

function startCount(){
    document.getElementById('count').value=num;
    num=num+1;
    i=setTimeout("startCount()",1000);
  }

AAAaaZz3248469

2017-08-01 00:02:35

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>

<script type="text/javascript">
var num=0;
var i;
var flag=false;

//增加一个布尔变量用于存储值代表start是否开始
//这个方法要置于循环体外
function flag1(){
if(flag==false){
startCount();
flag=true;
}else{
return 0;
}
}
function startCount(){
document.getElementById('count').value=num;
num=num+1;
i=setTimeout("startCount()",1000);
}
function stopCount(){
clearTimeout(i);
flag=false;
}
</script>
</head>
<body>
<form>
<input type="text" id="count" />
<input type="button" value="Start" onclick="flag1()" />
<input type="button" value="Stop" onclick="stopCount()" />
</form>
</body>
</html>

增加一个开关装置即可。解决了点一次start增快一次速度和num+1的问题。

0
Ericleung

2017-06-29 11:32:11

startCount() 的 cleanTimeout(i) 破坏了循环. 不要这句就好了.

0