栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

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

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

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. 引入插件

需要依赖jquery

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

ok,使用非常简单

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/244654.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号