适用于获取验证码等其他场景,下面代码直接粘贴句可以使用

// 60s获取验证码的js与html
var timer = null;
var count = 60;
$('.box>button').click(function() {
var codeText = $('.code').text();
if (codeText == '获取验证码') {
timer = setInterval(function(){
count--;
$('.code').text(count+'后获取验证码');
if (count <=0) {
clearInterval(timer);
$('.code').text('获取验证码');
}
},1000);
}
});
html:
<!-- 60s倒计时 -->
<div class='box'>
<button class='code'>获取验证码</button>
</div>

  

js实现60s倒计时效果的更多相关文章

  1. JS实现60s倒计时(亲测有效),及span标签如何使用和禁用onclick事件

    效果如下图:点击按钮出现60秒倒计时,60s内按钮不可用,倒计时到了时间方可再次点击获取. 另外还有一个知识点,只有input 及button这样的表单元素有disbale属性,如何设置是否可用属性的 ...

  2. JS实现验证码倒计时效果

    通常做注册页面时会有获取验证码按钮,然后点击后过60秒才能重新获取,比如现在项目中遇到的 然后点击后的样式,并且数字是递减的,到0时重新回到最初的状态(上图). 首先构造HTML结构 <butt ...

  3. 页面倒计时跳转页面效果,js倒计时效果

    页面倒计时跳转页面效果,js倒计时效果 >>>>>>>>>>>>>>>>>>>> ...

  4. 纯js倒计时效果(交流加群:452892873)(本群每天都更新学习资料)

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  5. JS实现倒计时效果,并退出系统

    背景:由于单点登录后,一直在本系统操作,可是门户体统的会话失效时间有30分钟,所以30分钟后,需要重新登录系统才可以进行操作. 方法:想过在本系统中的每个操作都先跟门户系统进行交互,渠道refresh ...

  6. js实现倒计时效果

    <!DOCTYPE html><head><meta http-equiv="Content-Type" content="text/htm ...

  7. 二、JavaScript语言--JS实践--倒计时效果

    主要内容:分析不同倒计时效果的计算思路及方法,掌握日期对象Date,获取时间的方法,计算时差的方法,实现不同的倒时计效果. Javascript 日期对象: Date()返回当前的日期和时间 getY ...

  8. Andorid实现点击获取验证码倒计时效果

    这篇文章主要介绍了Andorid实现点击获取验证码倒计时效果,这种效果大家经常遇到,想知道如何实现的,请阅读本文   我们在开发中经常用到倒计时的功能,比如发送验证码后,倒计时60s再进行验证码的获取 ...

  9. jquery网页倒计时效果,秒杀,限时抢购!

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. Squid作代理服务器,用户密码验证,高匿代理

    参考URL: https://www.cnblogs.com/vijayfly/p/5800038.html https://www.cnblogs.com/operaculus/p/5705184. ...

  2. mysql恢复ibd文件

    1.将原表删除,包括ibd和frm文件 2.重新创建表结构. 3.丢弃表空间 alter table tableName discard tablespace; 4.将要恢复的ibd文件拷贝到数据库目 ...

  3. luogu P2742 【模板】二维凸包 / [USACO5.1]圈奶牛Fencing the Cows

    题解: 二维凸包裸题 按照x坐标为第一关键字,y坐标为第二关键字排序 然后相邻判断叉积用单调队列搞过去 正反都做一次就好了 代码: #include <bits/stdc++.h> usi ...

  4. [HNOI2007]梦幻岛宝珠

    题解: 一道比较好的题目 首先比较显然的就是我们要按照a*2^b的b的顺序来枚举 那么状态f[i][j]表示当前在b,用了a*2^b 刚开始没想到怎么不同层之间搞 看了题解发现非常简单 由于每一层到最 ...

  5. Ubuntu14.04创建无线WiFi,android可以连接上网

    前提条件: ubuntu14.04 unity,已经通过有线连接到internet 一般环境下创建的wifi热点android设备是无法识别的,网上说通过ap-hotspot方式创建出来的热点手机可以 ...

  6. jQuery中live函数的替代-【jQuery】

    在老版本的jQuery中,当需要对页面上某个由ajax加载的某片段的页面内容响应事件时,可以使用live函数来响应其事件,比如: $('a').live('click', function() { b ...

  7. JQ JS复制到剪贴板

    示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  8. 51Nod1577 异或凑数 线性基

    原文链接https://www.cnblogs.com/zhouzhendong/p/51Nod1577.html 题意 给定一个长度为 n 的序列. 有 m 组询问,每一组询问给出 L,R,k ,询 ...

  9. httpmodule MVCapplication

    转自:http://www.cnblogs.com/fish-li/archive/2011/09/05/2168073.html http://www.cnblogs.com/yplong/p/55 ...

  10. oralce不像Java,java中字符串+数字,能够得到结果字符串

    oracle得到的两个字段进行相加,要求都是number类型的,如果两个是字符串会自动转成number类型(前提是能够转) select a+b from (select '1' a,'2' b fr ...