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

// 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. Github版本管理以及git使用

    1.git客户端编译安装 同步系统时间服务器 ntpdate cn.ntp.org.cn 安装依赖包: [root@baolin ~]# yum install epel-release -y [ro ...

  2. GoLang函数参数的传递练习

    春节买的GO方面的书,看了一次.现在撸一些代码,作为练习. // Copyright © 2019 NAME HERE <EMAIL ADDRESS> // // Licensed und ...

  3. 移动端根据不同DPR加载大小不同的图片

    1.首先创建mixin.styl文件代码如下: bg-image($url) // 创建bg-image($url)函数 background-image: url($url + "@2x. ...

  4. Android开发——使用Jword生成本地word文档

    本文主要介绍如何使用Jword生成本地word文档,这里涉及到Jword的使用技巧,本文给出相应的代码,需要的朋友可以参考下. 为什么使用Jword呢?因为IText .Freemark在安卓平台上压 ...

  5. Js计算时间差,天数,小时数,余数

    var begintime_ms = Date.parse(new Date(begintime.replace(/-/g, "/"))); //begintime 为开始时间 v ...

  6. UOJ#191. 【集训队互测2016】Unknown 点分治 分治 整体二分 凸包 计算几何

    原文链接https://www.cnblogs.com/zhouzhendong/p/UOJ191.html 题目传送门 - UOJ191 题意 自行移步集训队论文2016中罗哲正的论文. 题解 自行 ...

  7. java分页实现

    虽然现在有很多好用的框架,对分页进行支持,很简单的就把分页的效果做出来,但是如果自己手写是一个怎样的流程的?今天就来说说它,手动实现分页效果. 一.分页的思路 首先我们得知道写分页代码时的思路,保持思 ...

  8. unity打aar包工具

    需求: unity将游戏导出android工程之后,打成aar包的工具 第一种: 高版本的unity导出的android工程是android studio版的,那么打成aar的流程就是 1.build ...

  9. 四、Python导入自己写的包报错:没有该包如何解决

    场景:当你运行文件时,提示没有你想要导入的这个包,这是只需在你运行文件的开头添加俩行代码: import sys sys.path.apprnd('../') 原理:请看图解 另外解释下sys.pat ...

  10. 双11线上压测netty内存泄露

    最近线上压测,机器学习模型第一次应用到线上经历双11大促.JSF微服务有报错 LEAK: ByteBuf.release() was not called before it's garbage-co ...