setInterval与clearInterval的使用示例代码


Posted in Javascript onJanuary 28, 2014

setInterval是一个很有用的js函数,可以用来重复执行某些功能,利用这个我们可以实现一些很有趣的功能,比如:

不刷新页面的情况下,"实时"获取其它会员给你发来的问候,并弹出显示之类

下面给一个示例代码:(里面用了一些jquery的方法)

<html>
<head>
<title>jquery 操作 Select</title>
<script type="text/javascript" src="jquery-1.2.6.pack.js"></script>
<script type="text/javascript">
var i=1;
var _interval;
function showTime()
{
    var today = new Date();
    $("#msg").html(today.toLocaleString() + ",i=" + i);    
    i++;
    if (i>10)
    {
        clearInterval(_interval);
    }
}
$(document).ready(function(){    
    $("#btnStart").click(function(){
        showTime();
        _interval = setInterval("showTime()", 1000);
    })
    $("#btnStop").click(function(){                
        clearInterval(_interval);
        i=0;
    })
})
</script>
</head>
<body>
<label id="msg"></label> 
<button id="btnStart">开始记时</button> 
<button id="btnStop">停止记时</button>
<script type="text/javascript"></script>
</body>
</html>
Javascript 相关文章推荐
JS匀速运动演示示例代码
Nov 26 Javascript
jQuery实现图片上传和裁剪插件Croppie
Nov 29 Javascript
JavaScript实现ASC转汉字及汉字转ASC的方法
Jan 23 Javascript
javascript html5实现表单验证
Mar 01 Javascript
Javascript实现苹果悬浮虚拟按钮
Apr 10 Javascript
jQuery的内容过滤选择器学习教程
Apr 18 Javascript
JS实现图文并茂的tab选项卡效果示例【附demo源码下载】
Sep 21 Javascript
RequireJS 依赖关系的实例(推荐)
Jan 21 Javascript
JS中数组与对象的遍历方法实例小结
Aug 14 Javascript
解决vue A对象赋值给B对象,修改B属性会影响到A的问题
Sep 25 Javascript
微信小程序动画组件使用解析,类似vue,且更强大
Aug 01 Javascript
layui复选框的全选与取消实现方法
Sep 02 Javascript
Jquery实现的一种常用高亮效果示例代码
Jan 28 #Javascript
基于JQuery实现的Select级联
Jan 27 #Javascript
javascript根据像素点取位置示例
Jan 27 #Javascript
JS如何将数字类型转化为没3个一个逗号的金钱格式
Jan 27 #Javascript
FF IE浏览器修改标签透明度的方法
Jan 27 #Javascript
js阻止默认事件与js阻止事件冒泡示例分享 js阻止冒泡事件
Jan 27 #Javascript
javascript动态添加、修改、删除对象的属性与方法详解
Jan 27 #Javascript
You might like
smarty中先strip_tags过滤html标签后truncate截取文章运用
2010/10/25 PHP
php设计模式 Command(命令模式)
2011/06/26 PHP
php获取mysql字段名称和其它信息的例子
2014/04/14 PHP
Yii全局函数用法示例
2017/01/22 PHP
详解Yii2.0 rules验证规则集合
2017/03/21 PHP
Laravle eloquent 多对多模型关联实例详解
2017/11/22 PHP
动态表格Table类的实现
2009/08/26 Javascript
jQuery层次选择器选择元素使用介绍
2013/04/18 Javascript
javascript中的绑定与解绑函数应用示例
2013/06/24 Javascript
JavaScript判断文件上传类型的方法
2014/09/02 Javascript
在AngularJS应用中实现一些动画效果的代码
2015/06/18 Javascript
充分发挥Node.js程序性能的一些方法介绍
2015/06/23 Javascript
jQuery添加和删除指定标签的方法
2015/12/16 Javascript
JavaScript下的时间格式处理函数Date.prototype.format
2016/01/27 Javascript
用原生js做单页应用
2017/01/17 Javascript
详解基于angular路由的requireJs按需加载js
2017/01/20 Javascript
Vue.js render方法使用详解
2017/04/05 Javascript
nodejs简单访问及操作mysql数据库的方法示例
2018/03/15 NodeJs
微信小程序swiper实现滑动放大缩小效果
2018/11/15 Javascript
vue2.0自定义指令示例代码详解
2019/04/25 Javascript
原生JS实现随机点名项目的实例代码
2019/04/30 Javascript
[05:49]2014DOTA2TI4正赛第二日综述 昔日冠军纷纷落马 VG LGD占尽先机
2014/07/20 DOTA
Python实现简单拆分PDF文件的方法
2015/07/30 Python
Python获取文件所在目录和文件名的方法
2017/01/12 Python
python使用opencv读取图片的实例
2017/08/17 Python
python cv2.resize函数high和width注意事项说明
2020/07/05 Python
小结Python的反射机制
2020/09/28 Python
Araks官网:纽约内衣品牌
2020/10/15 全球购物
《爱如茉莉》教后反思
2014/04/12 职场文书
中职招生先进个人材料
2014/08/31 职场文书
合同和协议有什么区别?
2014/10/08 职场文书
2014年教学管理工作总结
2014/12/02 职场文书
模范教师材料大全
2014/12/16 职场文书
党员自我评价2015
2015/03/03 职场文书
自荐信模板大全
2015/03/27 职场文书
CSS3实现360度循环旋转功能
2022/02/12 HTML / CSS