js setInterval() 用法示例
Created by Marydon on
1.定义
语法：setInterval(param1,param2)
param1 要调用的函数或要执行的代码串。
param2 周期性调用param1的时间间隔，单位：毫秒
表示每隔多少毫秒执行一次param1。
停止执行需要使用clearInterval()。
2.情景展示
设置指定时间后，同意按钮才可以使用，并显示剩余时间
3.代码实现
使用计时器setInterval()方法可以实现
html
<body>
<div style="width:500px;">您通过本网站下使用或获取任何材料、信息、产品或服务之前，请先仔细阅读本 cookie 声明。我们有权随时更改、更新或更正任何本 cookie 声明或本网站所载任何信息，并将经修订条款公布于本网站，恕不另行通知。请不时审阅本 cookie 声明，确保您了解任何变更。如果本 cookie 声明有任何重大的变更，我们将会在本网站上的主页清楚说明这些变更。</div>
<input type="button" value="我同意" disabled="disabled"/>
</body>
javascript
<script type="text/javascript">
(function(i){// 闭包
var countDown;
// 对按钮进行操作
function change(i) {
var text = "我同意";
if (i > 0) {
text += "（" + i + "秒）";
} else {
$(':button').prop('disabled', false);
// 不再调用
clearInterval(countDown);
}
$(':button').val(text);
};
// 页面加载完毕执行
$(function(){
// 计时器（1秒调用一次）
countDown = setInterval(function () {
change(i);
i--;
}, 1 * 1000);// 1000毫秒
});
})(60);// 60s
</script>
4.效果展示
60秒后
5.小结
使用闭包的原因，是为了避免全局污染，不让外界访问到变量i；
闭包语法：(function(){//具体要执行的代码})()。
相关推荐：
js setInterval() 用法示例的更多相关文章
- Javascript模块化编程（三）：require.js的用法
Javascript模块化编程(三):require.js的用法 原文地址:http://www.ruanyifeng.com/blog/2012/11/require_js.html 作者: 阮一峰 ...
- JS 正则表达式用法
JS 正则表达式用法简介 简单的说,正则表达式是一种可以用于模式匹配和替换的强有力的工具.其作用如下: 测试字符串的某个模式.例如,可以对一个输入字符串进行测试,看在该字符串是否存在一个电话号码模式或 ...
- 腾讯云上PhantomJS用法示例
崔庆才 前言 大家有没有发现之前我们写的爬虫都有一个共性,就是只能爬取单纯的html代码,如果页面是JS渲染的该怎么办呢?如果我们单纯去分析一个个后台的请求,手动去摸索JS渲染的到的一些结果,那简直没 ...
- 腾讯云上Selenium用法示例
欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 作者:崔庆才 前言 在上一节我们学习了PhantomJS 的基本用法,归根结底它是一个没有界面的浏览器,而且运 ...
- (转)Javascript模块化编程（三）：Require.js的用法
转自 ruanyifeng 系列目录: Javascript模块化编程(一):模块的写法 Javascript模块化编程(二):AMD规范 Javascript模块化编程(三):Require.js的 ...
- Linux find 用法示例
Linux中find常见用法示例 ·find path -option [ -print ] [ -exec -ok command ] {} \; find命令的参数 ...
- jQuery中$.fn的用法示例介绍
$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效,下面有个不错的示例,喜欢的朋友可以参考下 如扩展$.fn.abc(),即$.fn.abc()是对jquery ...
- [转]Linux中find常见用法示例
Linux中find常见用法示例[转]·find path -option [ -print ] [ -exec -ok command ] {} \;find命令的参 ...
- oracle中to_date详细用法示例(oracle日期格式转换)
这篇文章主要介绍了oracle中to_date详细用法示例,包括期和字符转换函数用法.字符串和时间互转.求某天是星期几.两个日期间的天数.月份差等用法 TO_DATE格式(以时间:2007-11-02 ...
随机推荐
- Linux线程 之 线程 线程组 进程 轻量级进程（LWP） -systemtap -mysql
http://blog.chinaunix.net/uid-24774106-id-3650136.html http://blog.itpub.net/15480802/viewspace-7627 ...
- Bootstrap 3之美04-自定义CSS、Theme、Package
本篇主要包括: ■ 自定义CSS■ 自定义Theme■ 自定义Package 自定义CSS 有时候,需要自定义或重写Bootstrap默认的CSS.→在css文件夹下创建一个site.css→假 ...
- CLR查找和加载程序集 z
C#开发者在开发WinForm程序.Asp.Net Web(MVC)程序等,不可避免的在项目中引用许多第三方的DLL程序集, 编译后引用的dll都放在根目录下.以我个人作品 AutoProject S ...
- Mongodb后台daemon方式启动
Mongodb可以通过命令行方式和配置文件的方式来启动,具体命令如下: 命令行: [root@localhost mongodb]# ./bin/mongod --dbpath=/data/db 配置 ...
- MyEclipse中的内置浏览器中的历史记录怎么清除
eclipse内置浏览器的访问记录是存储在对应的工程目录下的.metadata配置中,也就是说你新建一个工程的话就没有了. 如果确实要删除那就找到工作空间中的org.eclipse.ui.browse ...
- JQuery文件上传及以Base64字符串形式呈现图片
一:上传之 首先,你必然得有一个 file input,如下: <td> <img id="imgGif" style="display: no ...
- NLP知识结构概述
NLP知识结构概述 1)自然语言处理:利用计算机为工具,对书面实行或者口头形式进行各种各样的处理和加工的技术,是研究人与人交际中以及人与计算机交际中的演员问题的一门学科,是人工智能的主要内容. 2)自 ...
- iOS:步进UIStepper、滑动块UISlider、开关UISwitch的基本使用
步进UIStepper.滑动块UISlider:当它们作为事件,被触发时,它们的值会发生改变.正因为如此,触发该事件时,可以一张一张翻阅浏览图片,,,, 步进UIStepper: @property( ...
- [6] 胶囊体(Capsule)图形的生成算法
顶点数据的生成 bool YfBuildCapsuleVertices ( Yreal radius, Yreal height, Yuint slices, Yuint stacks, YeOrig ...
- Informatica 常用组件Lookup缓存之五 使用动态查找高速缓存
对于关系查找,当目标表也是查找表时,可能要配置转换以使用动态高速缓存.PowerCenter 将在处理第一个查找请求时创建高速缓存.它将根据查找条件为传递给转换的每行查询高速缓存.当您使用动态高速缓存 ...