先看下效果

话不多说上代码~

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

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

                 num++;

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

            }

            function clockstop(){

                clearTimeout(i);

            }

            function clockclear(){

                num=0;

                setTimeout("document.getElementById('clock').value=0",0);

                clearTimeout(i);

            }

        </script>

    </head>

    <body>

        <input type="text" id="clock" /><br/><br/>

        <input type="button" value="开始" onclick="clockstart()" />

        <input type="button" value="停止" onclick="clockstop()" />

        <input type="button" value="复位" onclick="clockclear()" />

    </body>

</html

代码

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

            var attime=time.getHours()+":"+time.getMinutes()+":"+time.getSeconds();

            document.getElementById('clock').value=attime;

        }

        setInterval("clock()",100);

        </script>

    </head>

    <body>

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

    </body>

</html>

setTimeout、clearTimeout、setInterval,clearInterval ——小小计时器的更多相关文章

  1. JavaScript之关闭轮询定时器(setTimeout/clearTimeout|setInterval/clearInterval)小结

    已知: 1.1 开启Timeout程序: scope.setTimeout("functionName()" | functionHandle, timeValue) 返回值:ti ...

  2. 关闭定时器(setTimeout/clearTimeout|setInterval/clearInterval)

    1.1 开启Timeout程序: scope.setTimeout("functionName()" | functionHandle, timeValue) 返回值:timerI ...

  3. setTimeout,clearTimeout,setInterval,clearInteral详解

    设置定时器,在一段时间之后执行指定的代码,setTimeout与setInterval的区别在于setTimeout函数指定的代码仅执行一次 方法一: window.setTimeout(" ...

  4. js函数：setInterval()/clearInterval()——js网页计时器

    一.setInterval()/clearInterval()技术学习 都是window对象的方法,可以直接使用. setInterval(function(){},1000);:每1000毫秒执行一 ...

  5. 你真的了解setTimeout和setInterval吗？

    博客园的代码排版真难用,编辑时候是好的,一保存就是乱了——本文也同时发表在我另一独立博客上 你真的了解setTimeout和setInterval吗?,可以移步至这里吧 setTimeout和setI ...

  6. setTimeout和setInterval的各自使用场景

    默认的 setTimeout 只执行一次, 清除用clearTimeout setInterval 每间隔指定的时间, 就执行一次, 清除用clearInterval 但是, setTimeout也可 ...

  7. setTimeout()和setInterval()小结

    写在前面:在写H5游戏时经常需要使用定时刷新页面实现动画效果,比较常用即setTimeout()以及setInterval() setTimeout 描述 setTimeout(code,millis ...

  8. setTimeout和setInterval的使用

    引自(http://www.cnblogs.com/qiantuwuliang/archive/2009/06/20/1507304.html) 这两个方法都可以用来实现在一个固定时间段之后去执行Ja ...

  9. Node.js中setTimeout和setInterval的使用

    Node.js和js一样也有计时器,超时计时器.间隔计时器.及时计时器,它们以及process.nextTick(callback)函数来实现事件调度.今天先学下setTimeout和setInter ...

随机推荐

  1. Cocos2d-x 让精灵随手指移动起来二(简单实现)

    void HelloWorld::ccTouchMoved(cocos2d::CCTouch *touch, cocos2d::CCEvent *event) { CCSize winSize = C ...

  2. Python写的东西在CMD下打印中文

    以前遇到的问题是在IDLE中可以print出中文,在cmd却是乱码. 后来想明白,IDLE中默认编码是unicode,而cmd中是ANSI,即cp963,即GBK 所以这样就能输出中文了: s = “ ...

  3. HDU 1863 畅通工程

    畅通工程 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submissi ...

  4. 解析“extern”

    解析“extern” 1. 声明外部变量 现代编译器一般採用按文件编译的方式,因此在编译时,各个文件里定义的全局变量是 互相透明的,也就是说,在编译时,全局变量的可见域限制在文件内部.以下举一个简单的 ...

  5. MYSQL 5.7 新增150多个新功能

    http://www.thecompletelistoffeatures.com/ There are over 150 new features in MySQL 5.7. The MySQL ma ...

  6. Metadata Lock原理5

    [MySQL] 之一2015-09-05 15:46:51 分类: MySQL 一 简介 和MySQL打交道比较多的朋友,肯定遇到过 "Waiting for table metadata ...

  7. Python学习 之 switch语句

    1.python并没有提供switch语句,python可以通过字典实现switch语句的功能,实现方法分为两步 —首先,定义一个字典 —其次,调用字典的get()获取相应的表达式 通过字典调用函数 ...

  8. AngularJS - contorller app module

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. 关于错位动画的练习，原生js编写

    最近在网上看到一个关于错位动画的文章,感觉非常有趣,便自己练习了一下,文章连接:http://www.w3cplus.com/animation/staggering-animations.html ...

  10. PHP+ MongoDB

    环境: uname -v # SMP Debian -+deb7u2 php -v PHP -~dotdeb. (cli) (built: Jun ::) Copyright (c) - The PH ...