js实现n秒倒计时后才可以点击的效果


Posted in Javascript onDecember 20, 2015

在我们进行注册用户时经常遇到点击按钮后,60秒倒计时后才能继续可以点击,按钮上还能显示倒计时,这60秒时间就是为大家提供”细阅读协议“做准备的,这种功能是如何实现的,下面为大家分享详细代码。

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>倒计时然后才可以点击效果代码</title> 
<script type="text/javascript">
var s=4;
function countsub()
{
 var btnReg=document.getElementById("btnReg");
 if(btnReg)
 {
 if(s<=0)
 {
  btnReg.value="同意";
  btnReg.disabled=false;
  clearInterval(id);
 }
 else
 {
  btnReg.value="请仔细阅读协议(还剩"+s+"秒)";
  s--;
 }
 }
}
var id = setInterval('countsub()',1000)
</script>
</head>
<body>
<textarea>注册协议</textarea>
<input id="btnReg" type="button" value="同意" disabled="true" />
</body>
</html>

希望本文所述对大家学习javascript程序设计有所帮助。

Javascript 相关文章推荐
用js判断浏览器是否是IE的比较好的办法
May 08 Javascript
extjs 学习笔记 四 带分页的grid
Oct 20 Javascript
JQuery Highcharts 动态生成图表的方法
Nov 15 Javascript
JavaScript作用域与作用域链深入解析
Dec 06 Javascript
javascript二维数组转置实例
Jan 22 Javascript
jQuery实现折线图的方法
Feb 28 Javascript
在Node.js中使用HTTP上传文件的方法
Jun 23 Javascript
js拖拽的原型声明和用法总结
Apr 04 Javascript
通过js修改input、select默认字体颜色
Apr 19 Javascript
Bootstrap Table使用整理(一)
Jun 09 Javascript
9种改善AngularJS性能的方法
Nov 28 Javascript
ExtJs使用自定义插件动态保存表头配置(隐藏或显示)
Sep 25 Javascript
图解js图片轮播效果
Dec 20 #Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记6)
Dec 20 #Javascript
基于jquery实现页面滚动到底自动加载数据的功能
Dec 19 #Javascript
js点击按钮实现带遮罩层的弹出视频效果
Dec 19 #Javascript
js获取本机操作系统类型的两种方法
Dec 19 #Javascript
javascript精确统计网站访问量实例代码
Dec 19 #Javascript
js实现图片轮播效果
Dec 19 #Javascript
You might like
PHP4在WinXP下IIS和Apache2服务器上的安装实例
2006/10/09 PHP
PHP __autoload()方法真的影响性能吗?
2012/03/30 PHP
PHP随机字符串生成代码(包括大小写字母)
2013/06/24 PHP
教你如何使用php session
2013/10/28 PHP
PHP使Laravel为JSON REST API返回自定义错误的问题
2018/10/16 PHP
MC Dialog js弹出层 完美兼容多浏览器(5.6更新)
2010/05/06 Javascript
jquery mobile动态添加元素之后不能正确渲染解决方法说明
2014/03/05 Javascript
在jQuery中使用$而避免跟其它库产生冲突的方法
2015/08/13 Javascript
js实现类似菜单风格的TAB选项卡效果代码
2015/08/28 Javascript
AngularJS 应用身份认证的技巧总结
2016/11/07 Javascript
DropDownList实现可输入可选择(两种版本可选)
2016/12/07 Javascript
在vue中使用css modules替代scroped的方法
2018/03/10 Javascript
vuex操作state对象的实例代码
2018/04/25 Javascript
echarts统计x轴区间的数值实例代码详解
2019/07/07 Javascript
详解基于Vue/React项目的移动端适配方案
2019/08/23 Javascript
利用d3.js制作连线动画图与编辑器的方法实例
2019/09/05 Javascript
vue实现跳转接口push 转场动画示例
2019/11/01 Javascript
Python NumPy库安装使用笔记
2015/05/18 Python
Python编写登陆接口的方法
2017/07/10 Python
Python实现MySQL操作的方法小结【安装,连接,增删改查等】
2017/07/12 Python
Linux下python3.7.0安装教程
2018/07/30 Python
python学习之hook钩子的原理和使用
2018/10/25 Python
python路径的写法及目录的获取方式
2019/12/26 Python
Python单元测试模块doctest的具体使用
2020/02/10 Python
Python自动发送和收取邮件的方法
2020/08/12 Python
利用python进行文件操作
2020/12/04 Python
联想英国官网:Lenovo英国
2019/07/17 全球购物
请解释virtual关键字的含义
2015/06/17 面试题
JAVA招聘远程笔试题
2015/07/23 面试题
暑期社会实践先进个人主要事迹
2014/05/22 职场文书
机关党建工作汇报材料
2014/08/20 职场文书
2014年煤矿工人工作总结
2014/12/08 职场文书
追悼会答谢词
2015/01/05 职场文书
严以律己专题学习研讨会发言材料
2015/11/09 职场文书
市语委办2016年第十九届“推普周”活动总结
2016/04/05 职场文书
python实现简单聊天功能
2021/07/07 Python