真有意思,谁能告诉我这是为什么?

来源:8-6 取消计时器clearTimeout()

Groune

2015-04-02 21:55

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
</head>
<script type="text/javascript">
  var num=0;
  var i;
  function startCount(){
    document.getElementById('count').value=num;
    num=num+1;
    i=setTimeout("startCount()",1000);
  }
  function stopCount(){
  clearTimeout(i);
  i=0;num=0;
  document.getElementById('count').value=0;
  }
</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>

代码如上,start开始计数,stop停止计数并归零。

点击1次start正常显示,并且stop只需要点击1次就OK。

点击n(n>1)次start时,计数器以n倍速度计数,并且每点击1次stop,计数倍速减一,直至归零。

上一小节就发现了这个问题,请问这是为什么?

我猜一下:是因为每点击一次start就生成了一个计数函数,并且这些计数函数共用同一个全局变量num,然后每点击1次stop就clear一个?是这样吗?~~

写回答 关注

1回答

  • 用户已禁用
    2015-04-02 22:30:33

    不完全是n倍速,与你的点击时机有关。

    由于你的num是全局变量,所有计时器都对同一个num进行操作,所以越多计时器,num增加越快,而且计时器之间开始时间如果都是整秒的话,就能形成n倍速的效果。

    用户已禁用 回复Groune

    使用setInterval吧,少年。 setInterval(function(){ num++; }, 1000)

    2015-04-02 22:38:37

    共 2 条回复 >

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468219 学习 · 21891 问题

查看课程

相似问题