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


Posted in Javascript onJanuary 18, 2017

本文实例分析了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);
}
Javascript 相关文章推荐
使用IE6看老赵的博客 jQuery初探
Jan 17 Javascript
jsTree 基于JQuery的排序节点 Bug
Jul 26 Javascript
js限制文本框只能输入数字(正则表达式)
Jul 15 Javascript
jquery实现点击TreeView文本父节点展开/折叠子节点
Jan 10 Javascript
jquery获取特定name所有选中的checkbox,支持IE9标准模式
Mar 18 Javascript
JavaScript中的Number数字类型学习笔记
May 26 Javascript
js学习之----深入理解闭包
Nov 21 Javascript
JS 实现可停顿的垂直滚动实例代码
Nov 23 Javascript
解决Vue2.0中使用less给元素添加背景图片出现的问题
Sep 03 Javascript
Vue.js 十五分钟入门图文教程
Sep 12 Javascript
对angular 实时更新模板视图的方法$apply详解
Oct 09 Javascript
JavaScript中数组去重的5种方法
Jul 04 Javascript
JavaScript实现简易的天数计算器实例【附demo源码下载】
Jan 18 #Javascript
原生Javascript插件开发实践
Jan 18 #Javascript
js实现炫酷的左右轮播图
Jan 18 #Javascript
jQuery实现别踩白块儿网页版小游戏
Jan 18 #Javascript
工厂模式在JS中的实践
Jan 18 #Javascript
基于jQuery制作小图标上下滑动特效
Jan 18 #Javascript
JQuery Dialog对话框 不能通过Esc关闭的原因分析及解决办法
Jan 18 #Javascript
You might like
php下目前为目最全的CURL中文说明
2010/08/01 PHP
PHP包含文件函数include、include_once、require、require_once区别总结
2014/04/05 PHP
PHP实现的曲线统计图表示例
2016/11/10 PHP
PHP常用字符串函数小结(推荐)
2018/08/05 PHP
php获取目录下所有文件及目录(多种方法)(推荐)
2019/05/14 PHP
类之Prototype.js学习
2007/06/13 Javascript
原创javascript小游戏实现代码
2010/08/19 Javascript
javascript获取URL参数与参数值的示例代码
2013/12/20 Javascript
JS数组的常见用法实例
2015/02/10 Javascript
三个js循环的关键字示例(for与while)
2016/02/16 Javascript
EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)
2016/02/21 Javascript
Bootstrap CSS组件之下拉菜单(dropdown)
2016/12/17 Javascript
js实现文字列表无缝滚动效果
2017/06/23 Javascript
微信小程序选择图片和放大预览图片功能
2017/11/02 Javascript
Vue 页面跳转不用router-link的实现代码
2018/04/12 Javascript
vue自定义移动端touch事件之点击、滑动、长按事件
2018/07/10 Javascript
JavaScript函数apply()和call()用法与异同分析
2018/08/10 Javascript
vue-swiper的使用教程
2018/08/30 Javascript
node 版本切换的实现
2020/02/02 Javascript
基于JS实现计算24点算法代码实例解析
2020/07/23 Javascript
Python和Ruby中each循环引用变量问题(一个隐秘BUG?)
2014/06/04 Python
pytorch中的embedding词向量的使用方法
2019/08/18 Python
matplotlib 生成的图像中无法显示中文字符的解决方法
2020/06/10 Python
python自动化测试三部曲之request+django实现接口测试
2020/10/07 Python
幼儿如何来做好自我评价
2013/11/05 职场文书
2013届毕业生求职信范文
2013/11/20 职场文书
医大实习自我鉴定
2013/12/07 职场文书
教师一岗双责责任书
2014/04/16 职场文书
门店业绩提升方案
2014/06/08 职场文书
文明工地标语
2014/06/16 职场文书
教师暑期培训感言
2014/08/15 职场文书
档案接收函格式
2015/01/30 职场文书
大连星海广场导游词
2015/02/10 职场文书
MySQL pt-slave-restart工具的使用简介
2021/04/07 MySQL
mysql 排序失效
2022/05/20 MySQL
python 判断字符串当中是否包含字符(str.contain)
2022/06/01 Python