计时器多次点击,每点击一个开始就多一个计时器,而多个计时器同时工作的时候,每次单击只能停止一个计时器。

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

天心皓月

2018-06-22 10:17

<!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(){

    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>


写回答 关注

2回答

  • 阳火锅
    2018-06-22 11:19:33
    已采纳

    解决多开定时器的方法只有一个,就是让开关点击完一次不能再次点击。

    凭老夫多年经验给你2段代码,你把它们加上  document.getElementById("myButton").disabled = true;这段加在定时器打开的函数里面。。document.getElementById("myButton").disabled = false;这段加在定时器停止的函数里面。。  顺便你给打开定时的button起一个id=myButton

    天心皓月

    非常感谢!

    2018-06-22 12:22:42

    共 1 条回复 >

  • 阳火锅
    2018-06-22 11:36:48

    <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 a = true;

    function add(){

    document.getElementById('count').value=num;

    num=num+1;

    i=setTimeout("add()",1000);

    }

      function startCount(){

      if(a){

    add()

          }

      a = false;

      }

      


      function stopCount(){

    if(a==false){

    clearTimeout(i);

    }

    a = true;

      }


    </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>

    这是我之前学习时写的代码,这个就是不变button的

JavaScript进阶篇

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

467369 学习 · 21877 问题

查看课程

相似问题