js/jquery倒计时发送验证码按钮

简介:

 最近在写短信发送验证码,就写了个JS倒计时发送验证码按钮

Java代码   收藏代码
  1. <script language="javascript" src="jquery-1.7.1.min.js"></script>  
  2. <input type="button" id="btn" value="获取验证码"/>  
  3. <script type="text/javascript">  
  4.     var wait = resetWait = 60;  
  5.     function timer(t) {  
  6.         if (wait == 0) {  
  7.             t.removeAttribute("disabled");  
  8.             t.value = "获取验证码";  
  9.             wait = resetWait;  
  10.         } else {  
  11.             t.setAttribute("disabled"true);  
  12.             t.value = "重新发送(" + wait + ")";  
  13.             wait--;  
  14.             setTimeout(function(){ timer(t) }, 1000);  
  15.         }  
  16.     }  
  17.     $("#btn").click(function () {  
  18.         timer(this);  
  19.         sendSMS(mobile, sendType);  
  20.     });  
  21.         
  22.     function sendSMS(mobile, sendType){  
  23.         $.ajax({  
  24.             type: 'POST',  
  25.             url: '/verify/index',  
  26.             data: {mobile: mobile, type: sendType},  
  27.             success: function () {  
  28.             }  
  29.         });  
  30.     }  
  31. </script>  

 

相关文章
|
2月前
|
Web App开发 JavaScript 前端开发
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
|
3月前
|
JavaScript
鼠标事件(点击换色)分别使用js和jQuery代码实现
鼠标事件(点击换色)分别使用js和jQuery代码实现
43 1
|
1月前
|
JavaScript 前端开发 开发者
jQuery:JavaScript库的瑰宝
jQuery:JavaScript库的瑰宝
43 3
|
26天前
|
JavaScript 定位技术
jQuery鹰眼视图小地图定位预览插件minimap.js
这是一个jQuery小地图定位预览视图,默认左侧是页面主要内容,minimap.js的好处就是在它的右侧形成一个快速定位通道,产生一个缩小版的页面,即预览效果,可以点击并快速定位到页面的某个位置。简单实用,欢迎下载!
30 0
|
1月前
|
JavaScript 前端开发 API
深入了解jQuery:快速、高效的JavaScript库
【10月更文挑战第11天深入了解jQuery:快速、高效的JavaScript库
15 0
|
3月前
|
资源调度 JavaScript API
nest.js + sms 实现短信验证码登录
本文介绍了在Nest.js框架中集成短信验证码登录的实现方案,详细阐述了使用阿里云短信服务的配置流程、资质申请、短信模板设置,并提供了API调用示例和工程代码的运行步骤。
nest.js + sms 实现短信验证码登录
|
1月前
|
JavaScript 前端开发
JavaScript - 测试 jQuery
JavaScript - 测试 jQuery
14 0
|
1月前
|
JavaScript 前端开发
JavaScript三级联动jQuery写法
JavaScript三级联动jQuery写法
|
1月前
|
JavaScript 前端开发
JavaScript 树状菜单栏jQuery写法
JavaScript 树状菜单栏jQuery写法
|
1月前
|
JavaScript 前端开发 API
【前端基础篇】JavaScript之jQuery介绍
【前端基础篇】JavaScript之jQuery介绍
59 0