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 相关文章推荐
JS 学习笔记 防止发生命名冲突
Jul 30 Javascript
javascript 主动派发事件总结
Aug 09 Javascript
javascript 动态修改css样式方法汇总(四种方法)
Aug 27 Javascript
JavaScript函数的调用以及参数传递
Oct 21 Javascript
JavaScript中使用sencha gridpanel 编辑单元格、改变单元格颜色
Nov 26 Javascript
JavaScript类型系统之正则表达式
Jan 05 Javascript
javascript 日期相减-在线教程(附代码)
Aug 17 Javascript
vue中使用cropperjs的方法
Mar 01 Javascript
js指定日期增加指定月份的实现方法
Dec 19 Javascript
微信小程序全局变量的设置、使用、修改过程解析
Sep 24 Javascript
JS图片懒加载技术实现过程解析
Jul 27 Javascript
深入理解javascript中的this
Feb 08 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
PHP数组对比函数,存在交集则返回真,否则返回假
2011/02/03 PHP
PHP session有效期session.gc_maxlifetime
2011/04/20 PHP
PHP FOR MYSQL 代码生成助手(根据Mysql里的字段自动生成类文件的)
2011/07/23 PHP
PHP+apc+ajax实现的ajax_upload上传进度条代码
2016/01/25 PHP
PHP文字转图片功能原理与实现方法分析
2017/08/31 PHP
PHP集成环境XAMPP的安装与配置
2018/11/13 PHP
TNC vs IO BO3 第一场2.13
2021/03/10 DOTA
在JavaScript中遭遇级联表达式陷阱
2007/03/08 Javascript
5 cool javascript apps
2007/03/24 Javascript
保证JavaScript和Asp、Php等后端程序间传值编码统一
2009/04/17 Javascript
Javascript 鼠标移动上去 滑块跟随效果代码分享
2013/11/23 Javascript
Jquery的基本对象转换和文档加载用法实例
2015/02/25 Javascript
自定义刻度jQuery进度条及插件
2015/09/02 Javascript
js实现跨域的几种方法汇总(图片ping、JSONP和CORS)
2015/10/25 Javascript
jQuery表单对象属性过滤选择器实例详解
2016/09/13 Javascript
微信小程序 弹框和模态框实现代码
2017/03/10 Javascript
微信小程序 生命周期函数详解
2017/05/24 Javascript
Textarea输入字数限制实例(兼容iOS&amp;安卓)
2017/07/06 Javascript
微信小程序异步处理详解
2017/11/10 Javascript
vue发送ajax请求详解
2018/10/09 Javascript
详解webpack引用jquery(第三方模块)的三种办法
2019/08/21 jQuery
nodejs中的异步编程知识点详解
2021/01/17 NodeJs
python中使用pyhook实现键盘监控的例子
2014/07/18 Python
Windows下Python2与Python3两个版本共存的方法详解
2017/02/12 Python
Python图像处理之颜色的定义与使用分析
2019/01/03 Python
用Anaconda安装本地python包的方法及路径问题(图文)
2019/07/16 Python
python读取xml文件方法解析
2020/08/04 Python
python如何爬取动态网站
2020/09/09 Python
欧洲顶级体育电子商务网站:SportsShoes.com
2018/03/27 全球购物
家得宝墨西哥官网:The Home Depot墨西哥
2019/11/18 全球购物
英语文学专业学生的自我评价
2013/10/31 职场文书
毕业班联欢会主持词
2014/03/27 职场文书
稽核岗位职责
2015/02/10 职场文书
新党员入党决心书
2015/09/22 职场文书
Python数据分析之pandas读取数据
2021/06/02 Python
SpringBoot+VUE实现数据表格的实战
2021/08/02 Java/Android