zoukankan      html  css  js  c++  java
  • 正计时器

    正-计时器:实现从0开始一直向上计时,点停止时,就停止计时;点开始时再接着计时

    写计时器时,自己遇到的问题:

    1、连续点击开始时,数字加的很快

    解决此问题的思路:定义个变量初使值为真,如(var b=true);在开始按钮里,变量为真时,才执行定时器,接着给变量设为flase;再停止按钮时变量设为ture。

    下面是完整的代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style>
        #num{ 100px; height:20px; border:#000 solid 1px;}
    </style>
    </head>

    <body>
        <div id="num"></div>
        <button type="button" name="" id="btn1">开始</button>
        <button type="button" name="" id="btn2">停止</button>
        <script>
            var i=0;
            var h=true;//通过这个变量来解决连继点击开始出现数字加速的问题
            var a=null;
            var num=document.getElementById("num");
            var btn1=document.getElementById("btn1");
            var btn2=document.getElementById("btn2");
            function c(){
                num.innerHTML=i;
                i++;
            }
            a=setInterval("c()",1000);
            btn1.onclick=function(){
                h && (a=setInterval("c()",1000));//当h为真时才执行计时
                h=false;
            }
            btn2.onclick=function(){
                clearInterval(a);
                h=true;
            }
        </script>
    </body>
    </html>

  • 相关阅读:
    Android 中 Fragment 的切换(解决 replace 的低效)
    Android 中 OkGo 的使用 (封装 OkHttp)
    fastjson 封装工具类
    给系统添加右键使用 IDEA 打开的功能
    发现了一个很好看的博客园主题
    AndroidStudio中如何创建指定布局的layout文件
    转载:十个前端UI优秀框架
    win10 添加 telnet 工具
    tomcat各版本与jdk及servlet各版本对应关系
    servlet和jsp的maven依赖
  • 原文地址:https://www.cnblogs.com/sensualgirl/p/2594342.html
Copyright © 2011-2022 走看看