JavaScript短信验证码60秒倒计时插件

该插件依赖于jquery，用于发送短信验证码后的60秒倒计时：

下载完整代码: 下载

下载后的完整实例包括:

插件完整源码

countdown.js：

$(function(){$(".captchaBtn").html('获取验证码').on("click", function(){var that = $(this);var seconds = 60;that.attr("disabled", true);that.html(seconds+'秒');let promise = new Promise((resolve, reject) => {let setTimer = setInterval(() => {seconds -= 1;// console.info('倒计时:' + seconds);that.html(seconds+'秒');if (seconds <= 0) {that.html('获取验证码');resolve(setTimer)}}, 1000)})promise.then((setTimer) => {// console.info('清除');clearInterval(setTimer);that.attr("disabled", false);})   })
});

如何使用

1. 引入插件

<script src="jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="countdown.js" type="text/javascript"></script>

需要依赖jquery

2. 在"获取验证码"按钮上添加 class="captchaBtn"

<button class="captchaBtn"></button>

ok，使用非常简单

JavaScript短信验证码60秒倒计时插件相关推荐

vue页面实现短信验证码60秒倒计时
废话不多说,直接上代码. template <div class='single-wrapper fs14'><div class='single-mb'>短信验证</d ...
使用Jquery实现获取短信验证码60秒倒计时
现在使用手机号+验证码的方式注册账号已经成为一种必备功能,当我们输入手机号点击发送验证码按钮后,按钮应该不可被再次点击,并开始倒计时,倒计时结束后才能再次点击.这一个可以借助某些插件实现,但其实使用J ...
短信验证码60秒倒计时
html 区域 <el-button :disabled="isClick" @click="doNotRepeatOperation">{{tim ...
vue element-ui实现获取短信验证码 ,60秒倒计时及页面
cc废话不多说先上效果图 vue页面布局 <el-form-item prop="phoneCode" class="pr"><el-inp ...
java短信验证码 60秒_Rxjava操作符飙车系列（三）验证码倒计时
现在很多软件都需要获取短信验证码,通常都是60秒在向服务器发送一次请求.那么如果用Rxjava来实现这个倒计时的功能呢? 用到的操作符如下: 1.interval: interval 创建一个按照给定 ...
iOS 之倒计时 NSTimer 短信验证码 60秒 60分钟
- (void)viewDidLoad { [superviewDidLoad]; label = [[UILabelalloc]initWithFrame:CGRectMake(10,120, 12 ...
php 短信验证码30分钟,php下发短信验证码60秒简单验证
下发短信验证码,除了注册就是验证手机号简单实现原理就是用手机号和一个键作为key存到缓存里, 用户请求的时候,验证这个手机号是不是已经申请过key*(即已手机号为缓存的key有没有,)如果有,并且 ...
php短信验证码60秒时间限定
我们在实际使用短信验证码的时候,经常会因为各种原因,收不到短信,那么用户就会再重新请求一条,但是呢,一般的短信验证肯定是有时间间隔的,这样做,第一是为了防止恶意点击,一直发验证码,导致验证码消耗量巨大 ...
榛子云短信-微信小程序60秒倒计时插件
为了帮助开发者更便捷的使用微信小程序的短信验证码功能,特别是初学者更好的使用,榛子云短信特地开发了60秒倒计时插件,效果: 使用方法 1.引入插件countdown.js var CountDown ...
JS实现注册登录发送短信验证码动态显示60S倒计时完整案例
通常在web项目中都会遇到账户注册或者忘记密码时需要发送短信验证码的功能,虽然说这种功能很常见,但是实际开发过程中很多人还会遇到不少坑.笔者经过整理把最近项目中的用到的这个发送短信验证码动态显示60S ...

JavaScript短信验证码60秒倒计时插件

JavaScript短信验证码60秒倒计时插件相关推荐

最新文章

热门文章