JavaScript setTimeout和setInterval的使用方法 说明


Posted in Javascript onMarch 25, 2010

不同的是setInterval会每隔指定的时间段就执行一次代码,具有重复性。而setTimeout只会调用后执行一次。
下面通过函数的建立和函的自动删除来深刻理解两个函数;
1.函数的建立
setTimeOut的建立:

showTime(); 
function showTime() 
{ 
var today = new Date(); 
alert("The time is: " + today.toString()); 
setTimeout("showTime()", 5000); 
}

调用函数后五秒钟才会执行一次showtime函数
setInterval的建立
setInterval("showTime()", 5000); 
function showTime() 
{ 
var today = new Date(); 
alert("The time is: " + today.toString()); 
}

总结:貌似两个函数的结果相似,其实不然第二个函数会反复的报时,直到该网页被关闭。
两个函数的消除:
setTimeout的消除使用
clearTimeout()函数;调用的实例:
var timeoutProcess = setTimeout("alert('GOAL!')", 3000); 
var stopGoalLink = document.getElementById("stopGoalLink"); 
attachEventListener(stopGoalLink, "click", stopGoal, false);//加入事件函数,参数为(目标;事件;调用的函数;是否冒泡) 
function stopGoal() 
{ 
clearTimeout(timeoutProcess); 
}

setInterval的消除
var timeoutProcess = setTimeout("alert('GOAL!')", 3000); 
var stopGoalLink = document.getElementById("stopGoalLink"); 
attachEventListener(stopGoalLink, "click", stopGoal, false);//加入事件函数,参数为(目标;事件;调用的函数;是否冒泡) 
function stopGoal() 
{ 
clearInterval(timeoutProcess); 
}
Javascript 相关文章推荐
jQuery 学习第六课 实现一个Ajax的TreeView
May 17 Javascript
ie6下png图片背景不透明的解决办法使用js实现
Jan 11 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
Jan 12 Javascript
JavaScript数组去重的几种方法效率测试
Oct 23 Javascript
详解JavaScript树结构
Jan 09 Javascript
bootstrap confirmation按钮提示组件使用详解
Aug 22 Javascript
微信小程序使用toast消息对话框提示用户忘记输入用户名或密码功能【附源码下载】
Dec 09 Javascript
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
微信小程序与后台PHP交互的方法实例分析
Dec 10 Javascript
Vue CLI项目 axios模块前后端交互的使用(类似ajax提交)
Sep 01 Javascript
vue限制输入框只能输入8位整数和2位小数的代码
Nov 06 Javascript
Vuex实现数据增加和删除功能
Nov 11 Javascript
JavaScript 学习初步 入门教程
Mar 25 #Javascript
ext 列表页面关于多行查询的办法
Mar 25 #Javascript
JS学习之一个简易的日历控件
Mar 24 #Javascript
javascript instanceof,typeof的区别
Mar 24 #Javascript
ExtJs使用IFrame的实现代码
Mar 24 #Javascript
JS 显示当前日期与时间的代码
Mar 24 #Javascript
jQuery EasyUI 开源插件套装 完全替代ExtJS
Mar 24 #Javascript
You might like
php之字符串变相相减的代码
2007/03/19 PHP
PHP时间戳使用实例代码
2008/06/07 PHP
PHP 的Opcache加速的使用方法
2017/12/29 PHP
Jquery 弹出层插件实现代码
2009/10/24 Javascript
JavaScript中Object.prototype.toString方法的原理
2016/02/24 Javascript
RequireJS多页面应用实例分析
2016/06/29 Javascript
Jquery Easyui对话框组件Dialog使用详解(14)
2016/12/19 Javascript
JavaScript无缝滚动效果的实例代码
2017/03/27 Javascript
Jquery获取radio选中的值
2017/05/05 jQuery
vue-cli webpack 开发环境跨域详解
2017/05/18 Javascript
javascript  数组排序与对象排序的实例
2017/07/17 Javascript
JS脚本实现网页自动秒杀点击
2018/01/11 Javascript
详解VUE-地区选择器(V-Distpicker)组件使用心得
2018/05/07 Javascript
Vue 中对图片地址进行拼接的方法
2018/09/03 Javascript
JavaScript JMap类定义与使用方法示例
2019/01/22 Javascript
JSONP 的原理、理解 与 实例分析
2020/05/16 Javascript
python的exec、eval使用分析
2017/12/11 Python
Python实现PS滤镜功能之波浪特效示例
2018/01/26 Python
Python实现报警信息实时发送至邮箱功能(实例代码)
2019/11/11 Python
Python 获取命令行参数内容及参数个数的实例
2019/12/20 Python
python GUI库图形界面开发之PyQt5访问系统剪切板QClipboard类详细使用方法与实例
2020/02/27 Python
Django ORM实现按天获取数据去重求和例子
2020/05/18 Python
python学习将数据写入文件并保存方法
2020/06/07 Python
iframe与window.onload如何使用详解
2020/05/07 HTML / CSS
英国一家专门出售品牌鞋子的网站:Allsole
2016/08/07 全球购物
土耳其时尚购物网站:Morhipo
2017/09/04 全球购物
英国工艺品购物网站:Minerva Crafts
2018/01/29 全球购物
eBay英国购物网站:eBay.co.uk
2019/06/19 全球购物
奥地利领先的在线药房:SHOP APOTHEKE
2019/10/07 全球购物
中英文自我评价语句
2013/12/20 职场文书
函授本科自我鉴定
2014/02/04 职场文书
党支部党的群众路线对照检查材料
2014/09/24 职场文书
管理人员岗位职责
2015/02/14 职场文书
钱学森观后感
2015/06/04 职场文书
python爬虫之爬取笔趣阁小说
2021/04/22 Python
Django显示可视化图表的实践
2021/05/10 Python