我这段js计时器的开始和停止按钮的代码哪有错误?

来源:8-5 计时器setTimeout()

叔本华Arthur

2016-03-20 21:44

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>计时器</title>

<script type="text/javascript">

   function clock(){

      var time=new Date();                     

      document.getElementById("clock").value = time;

   }

     var i=setInterval(function(){

         clock()

     },100)

     function clock2(){

         clearInterval(i)

     }

function clock3(){

var i=setInterval(function(){

clock()},100)

}

</script>

</head>

<body>

  <form>

    <input type="text" id="clock" size="50"  />

    <input type="button" value="Stop" onclick="clock2()" />

    <input type="button" value="Continue" onclick="clock3()">

  </form>

</body>

</html>

按了continue之后再按stop就无效了,该怎么改



写回答 关注

3回答

  • 没有情绪
    2016-03-20 23:21:54

    <!DOCTYPE HTML>

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>计时器</title>

    <script type="text/javascript">

        function clock(){

          var time=new Date();                     

          document.getElementById("clock").value = time;

       }


        var i;

        function clock2(){

             clearInterval(i)

         }

        function clock3(){

        i=clearInterval(i)

    i=setInterval(clock,100)

    }

    </script>

    </head>

    <body>

      <form>

        <input type="text" id="clock" size="50" onclick="clock3()"/>

        <input type="button" value="Stop" onclick="clock2()" />

        <input type="button" value="Continue" onclick="clock3()">

      </form>

    </body>

    </html>

    多次摁的问题解决了 但是 上来还是不显示时间。

  • 没有情绪
    2016-03-20 23:12:55

    上面的代码有bug;就是刚开始没有显示时间,你的先摁一下Continue才能触发。还有一个bug就是你多次触发Continue 再stop 不好使 你自己改一下。

  • 没有情绪
    2016-03-20 23:06:59

    给一个全局变量。var = i;

    <!DOCTYPE HTML>

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>计时器</title>

    <script type="text/javascript">

        function clock(){

          var time=new Date();                     

          document.getElementById("clock").value = time;

       }


        var i;

        function clock2(){

             clearInterval(i)

         }

        function clock3(){

    i=setInterval(clock,100)

    }

    </script>

    </head>

    <body>

      <form>

        <input type="text" id="clock" size="50"  />

        <input type="button" value="Stop" onclick="clock2()" />

        <input type="button" value="Continue" onclick="clock3()">

      </form>

    </body>

    </html>


JavaScript进阶篇

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

468194 学习 · 21891 问题

查看课程

相似问题