js clearInterval()方法的定义和用法


Posted in Javascript onNovember 11, 2015

此方法能够取消setInterval()方法设置的定时器。

此方法的参数必须是要取消相应的setInerval()方法的返回值。

点击可参阅更多window对象的属性和方法。

语法结构:

clearInterval(id)

参数列表:

参数 描述
id 必需。此id是setInerval()的返回值,是此setInerval()方法的唯一标识。

浏览器支持:

(1).IE浏览器支持此属性。
(2).Firefox浏览器支持此属性。
(3).Opera浏览器支持此属性。
(4).chrome浏览器支持此属性。
(5).safria浏览器支持此方法。

代码实例:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<meta name="author" content="http://www.softwhy.com/" />
<title>window对象的clearInterval()方法 -蚂蚁部落</title>
<style type="text/css">
#num{
 width:100px;
 height:100px;
 text-align:center;
 line-height:100px;
 background-color:green;
 margin:50px auto 0px auto;
 color:red;
}
#btdiv{
 width:76px;
 height:76px;
 margin:0px auto;
}
</style>
<script type="text/javascript">
var a=0;
window.onload=function(){
 var num=document.getElementById("num");
 var bt=document.getElementById("bt");
 function jisuan(){
 num.innerHTML=a;
 a=a+1;
 }
 var flag=setInterval(jisuan,1000);
 bt.onclick=function(){
 clearInterval(flag);
 }
}
</script>
</head>
<body>
<div id="num"></div>
<div id="btdiv"><button id="bt">点击取消</button></div>
</body>
</html>

以上代码点击按钮可以取消数字自增效果。

Javascript 相关文章推荐
JQuery小知识
Oct 15 Javascript
js性能优化 如何更快速加载你的JavaScript页面
Mar 17 Javascript
javasript实现密码的隐藏与显示
May 08 Javascript
JS+CSS实现的日本门户网站经典选项卡导航效果
Sep 27 Javascript
灵活的理解JavaScript中的this指向
Feb 25 Javascript
js封装成插件_Canvas统计图插件编写实例
Sep 12 Javascript
Vuex实现计数器以及列表展示效果
Mar 10 Javascript
200行HTML+JavaScript实现年会抽奖程序
Jan 22 Javascript
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
判断JavaScript中的两个变量是否相等的操作符
Dec 21 Javascript
小程序实现长按保存图片的方法
Dec 31 Javascript
js加减乘除精确运算方法实例代码
Jan 17 Javascript
jquery原理以及学习技巧介绍
Nov 11 #Javascript
window.setInterval()方法的定义和用法及offsetLeft与style.left的区别
Nov 11 #Javascript
轻松实现javascript数据双向绑定
Nov 11 #Javascript
谈谈对offsetleft兼容性的理解
Nov 11 #Javascript
详解 javascript中offsetleft属性的用法
Nov 11 #Javascript
jquery事件的ready()方法使用详解
Nov 11 #Javascript
浅谈使用MVC模式进行JavaScript程序开发
Nov 10 #Javascript
You might like
浅析ThinkPHP的模板输出功能
2014/07/01 PHP
php+ajax登录跳转登录实现思路
2016/07/31 PHP
PHP+Apache+Mysql环境搭建教程
2016/08/01 PHP
PHP实时统计中文字数和区别
2019/02/28 PHP
微信小程序商城项目之侧栏分类效果(1)
2017/04/17 Javascript
Angular中ng-repeat与ul li的多层嵌套重复问题
2017/07/24 Javascript
js异步编程小技巧详解
2017/08/14 Javascript
jQuery实现菜单栏导航效果
2017/08/15 jQuery
vue刷新和tab切换实例
2018/02/11 Javascript
vue内置指令详解
2018/04/03 Javascript
VUE 配置vue-devtools调试工具及安装方法
2018/09/30 Javascript
React Hooks的深入理解与使用
2018/11/12 Javascript
微信小程序云开发之使用云函数
2019/05/17 Javascript
mpvue微信小程序开发之实现一个弹幕评论
2019/11/24 Javascript
微信小程序图片加载失败时替换为默认图片的方法
2019/12/09 Javascript
node+multer实现图片上传的示例代码
2020/02/18 Javascript
[56:58]VP vs Optic 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
[48:00]完美世界DOTA2联赛循环赛 Forest vs Inki BO2第二场 11.04
2020/11/04 DOTA
一个小示例告诉你Python语言的优雅之处
2014/07/04 Python
Python的Flask框架中@app.route的用法教程
2015/03/31 Python
Python学习笔记整理3之输入输出、python eval函数
2015/12/14 Python
利用Python中unittest实现简单的单元测试实例详解
2017/01/09 Python
Python 文件操作的详解及实例
2017/09/18 Python
django定期执行任务(实例讲解)
2017/11/03 Python
详解Django的model查询操作与查询性能优化
2018/10/16 Python
python利用ffmpeg进行录制屏幕的方法
2019/01/10 Python
从0开始的Python学习014面向对象编程(推荐)
2019/04/02 Python
Python self用法详解
2020/11/28 Python
IE下实现类似CSS3 text-shadow文字阴影的几种方法
2011/05/11 HTML / CSS
HTML5 FormData 方法介绍以及实现文件上传示例
2017/09/12 HTML / CSS
俄罗斯在线手表和珠宝商店:AllTime
2019/09/28 全球购物
2014年大学宣传部工作总结
2014/12/19 职场文书
材料采购员岗位职责
2015/04/03 职场文书
golang 如何用反射reflect操作结构体
2021/04/28 Golang
python字典的元素访问实例详解
2021/07/21 Python
《帝国时代4》赛季预告 新增内容编译器可创造地图
2022/04/03 其他游戏