JavaScript计时器用法分析【setTimeout和clearTimeout】

本文实例分析了JavaScript计时器用法。分享给大家供大家参考，具体如下：

JavaScript中使用setTimeout和clearTimeout函数进行计时/停止计时的操作。

1.指定时间后执行一个动作，如3s后弹出一个对话框：

setTimeout('alert("3s")',5000);

并且，该函数可以叠加起来是用，如：

function delay_times(){
   setTimeout('document.getElementById("time_text").innerHTML = "2s"',2000);
   setTimeout('document.getElementById("time_text").innerHTML = "4s"',4000);
   setTimeout('document.getElementById("time_text").innerHTML = "6s"',6000);
}

2.实现开始计数与停止计数的例子：

var count = 0;
var myTimer;
//开始计数
function start_counter(){
   document.getElementById("time_count").innerHTML = count;
   count++;
   myTimer = setTimeout("start_counter()",1000);
}
//停止计数
function stop_counter(){
   clearTimeout(myTimer);
}

PS：这里再为大家推荐几款时间及计时器相关工具供大家参考使用：

在线秒表工具：
http://tools.jb51.net/bianmin/miaobiao

Unix时间戳(timestamp)转换工具：
http://tools.jb51.net/code/unixtime

在线世界各地时间查询：
http://tools.jb51.net/zhuanhuanqi/worldtime

更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《JavaScript时间与日期操作技巧总结》《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

赞 (0)

相关推荐

  • javascript设计简单的秒表计时器

    javascript设计简单的秒表计时器

    本文实例讲述了javascript设计简单的秒表计时器的实现代码.分享给大家供大家参考.具体如下: 运行效果截图如下: 具体代码如下: <html> <head> <title> New Document </title> </head> <body> <form action="somepage.asp"> <input type="text" value="0&q

  • javascript计时器编写过程与实现方法

    javascript计时器编写过程与实现方法

    JavaScript是一门非常容易上手的脚本语言,而且工具繁多,功能强大,因为一直做后端的关系,笔者目前也只是略学一点皮毛. 接下来进入正题--计时器.先谈下计时器的功能: 1.计时器要能够在页面上显示时间 2.每秒钟计时器刷新,秒每满60进分钟1,分钟每满60进小时1 3.计时器需要能够重置,也就是重新计时 4.计时结束时,需要能够有获取计时时间的方法 以上功能很简单,计时还应该有暂停.继续计时等功能,没关系,我们一个一个来. 第一步: 我们做一个简单的页面,要有一个现实时间的标签,要有开始.

  • JS 页面计时器示例代码

    复制代码 代码如下: <html> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <head> <script type="text/javascript"> var c=0 var t function timedCount() { document.getElementById('txt').value

  • javascript计时器事件使用详解

    在 JavaScritp 中使用计时事件是很容易的,两个关键方法是: setTimeout()未来的某时执行代码 clearTimeout()取消setTimeout()setTimeout()语法 复制代码 代码如下: var t=setTimeout("javascript语句",毫秒) setTimeout() 方法会返回某个值.在上面的语句中,值被储存在名为 t 的变量中.假如你希望取消这个 setTimeout(),你可以使用这个变量名来指定它.setTimeout() 的第

  • VB倒计时器和JS当前时间

    VBscript做计时器,遇到一个问题,怎么在页面上不断的调用一个VB函数呢.... 例如倒计时,如何让秒数在不刷新的情况下走动... 想了好久,查了好多地方都是用JavaScript做的... 最后才发现了一个,是VBscript帮助上都没有说的..SetTimeOut属性..真晕哦.. 倒计时如下. 倒计时 sec=2 min=1 hou=0 SetTimeOut "SpareTime()",1000 sub SpareTime() if sec=0 and min=0 and h

  • js仿苹果iwatch外观的计时器代码分享

    js仿苹果iwatch外观的计时器代码分享

    本文实例讲述了JS+CSS3实现的类似于苹果iwatch计时器特效.分享给大家供大家参考.具体如下: JS+CSS3实现的类似于苹果iwatch计时器特效是一段实现了类似于最近最火爆的苹果iwatch计时器效果的代码,带有开始和重置按钮,支持计次显示. 运行效果图:                                -------------------查看效果 下载源码------------------- 小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式. 为大家分享的JS

  • javascript实现的简单计时器

    最近写了很多微信端的互动小游戏,比如下雪花 限时点击 赢取奖品,限时拼图,限时答题等,都是些限时'游戏'(其实算不上游戏,顶多算是具有一点娱乐性的小互动而已) 上面出现了4个限时,对,没错,这里记录的就是最近写的 '计时器' ... 恩 , 计时器 就一个setInterval 或 setTimeout 即可实现 ,代码不会超过十行! 但是不防抱着没事找事的心态,来写个能复用的计时器 1.能倒计时 也能顺计时 2.复位.暂停.停止,启动功能 //计时器 window.timer = (funct

  • javascript实现计时器的简单方法

    javascript实现计时器的简单方法

    计时器, 在生活当中也是用得频繁的功能, 比如锻炼身体, 跑步比赛等等相关的活动. 我们用Javascript来完成一个计时器. 计时器, 主要就是对时间的一个逻辑处理, 比如60秒等于1分钟, 60分钟等于一个小时, 我们这里只做到小时的处理. 就这么一个简单的逻辑, 然后动态的显示在一个Input里面. 那现在我们来完成这个界面 <label>计时:</label> <input type="text" name="" id=&qu

  • javascript计时器详解

    javascript计时器详解

    计时器 基本格式: 复制代码 代码如下: setInterval(function(){代码},1000): /* 说明:1.setInterval 会返回一个计时器ID值 可以这样接收.var setId = setInterval(....); 2.接收setId的目的是为了清空计时器. clearTimeout(setId); */ 例如 一次性的计时器 格式: 复制代码 代码如下: setTimeout(function(){代码},1000) 案例: 复制代码 代码如下: var se

  • Node.js中使用计时器定时执行函数详解

    如果你熟悉客户端JavaScript编程,你可能使用过setTimeout和setInterval函数,这两个函数允许延时一段时间再运行函数.比如下面的代码, 一旦被加载到Web页面,1秒后会在页面文档后追加"Hello there": 复制代码 代码如下: var oneSecond = 1000 * 1; // one second = 1000 x 1 ms setTimeout(function() { document.write('<p>Hello there.

  • JavaScript计时器示例分析

    1.什么是JavaScript计时器? 在JavaScript中,我们可以在设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行. 2.计时器类型 一次性计时器:仅在指定的延迟时间之后触发一次. 间隔性触发计时器:每隔一定的时间间隔就触发一次 3.计时器方法 1):一次性计时器 A):setTimeout(): 指定的延迟时间之后来执行代码,进执行一次 语法:setTimeout(代码,延迟时间); 参数说明: 1. 要调用的函数或要执行的代码串. 2. 延时时间:在执行代码前需等待的时间

  • 浅谈JavaScript的计时器对象

    浅谈JavaScript的计时器对象

    1.JavaScript计时器,我们可以在设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行. 计时器类型: 1)一次性计时器:仅在指定的延迟时间之后触发一次. 2)间隔性触发计时器:每隔一定的时间间隔就触发一次. 计时器方法: 1)setInterval() :在执行时,从载入页面后每隔指定的时间执行代码. //语法 setInterval(代码,交互时间); //参数说明:1. 代码:要调用的函数或要执行的代码串.2. 交互时间:周期性执行或调用表达式之间的时间间隔,以毫秒计(1s=

  • JavaScript分秒倒计时器实现方法

    JavaScript分秒倒计时器实现方法

    本文实例讲述了JavaScript分秒倒计时器实现方法.分享给大家供大家参考.具体分析如下: 一.基本目标 在JavaScript设计一个分秒倒计时器,一旦时间完成使按钮变成不可点击状态 具体效果如下图,为了说明问题,调成每50毫秒也就是每0.05跳一次表, 真正使用的时候,把window.onload=function(){...}中的setInterval("clock.move()",50);从50调成1000即可. 在时间用完之前,按钮还是可以点击的. 时间用完之后,按钮就不能

随机推荐