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月前
|
JavaScript 前端开发
jQuery和CSS3滑动展开菜单按钮插件
这是一款jQuery和CSS3滑动展开菜单按钮插件。该滑动展开菜单按钮在用户点击主菜单按钮之后,子菜单以滑动的方式依次展开
68 21
|
2月前
|
JavaScript 前端开发 iOS开发
ios样式开关按钮jQuery插件
ios样式开关按钮jQuery插件
57 7
|
3月前
|
JavaScript 前端开发
js+jquery实现贪吃蛇经典小游戏
本项目采用HTML、CSS、JavaScript和jQuery技术,无需游戏框架支持。通过下载项目文件至本地,双击index.html即可启动贪吃蛇游戏。游戏界面简洁,支持方向键控制蛇移动,空格键实现游戏暂停与恢复功能。
83 14
|
3月前
|
JavaScript 前端开发 容器
jQuery多功能滑块插件r-slider.js
r-slider.js是一款jQuery多功能滑块插件。使用该插件,可以制作出滑块、开关按钮、进度条、向导步骤等多种效果。
61 5
|
3月前
|
JavaScript
jQuery+css3制作精美的2024圣诞节倒计时页面
jQuery+css3制作精美的2024圣诞节倒计时页面动画
33 0
jQuery+css3制作精美的2024圣诞节倒计时页面
|
4月前
|
JavaScript 前端开发 开发者
jQuery:JavaScript库的瑰宝
jQuery:JavaScript库的瑰宝
97 3
|
3月前
|
JavaScript 定位技术
jQuery鹰眼视图小地图定位预览插件minimap.js
这是一个jQuery小地图定位预览视图,默认左侧是页面主要内容,minimap.js的好处就是在它的右侧形成一个快速定位通道,产生一个缩小版的页面,即预览效果,可以点击并快速定位到页面的某个位置。简单实用,欢迎下载!
46 0
|
4月前
|
JavaScript 前端开发 API
深入了解jQuery:快速、高效的JavaScript库
【10月更文挑战第11天深入了解jQuery:快速、高效的JavaScript库
50 0
|
4月前
|
JavaScript 前端开发
JavaScript - 测试 jQuery
JavaScript - 测试 jQuery
29 0
|
4月前
|
JavaScript 前端开发
JavaScript三级联动jQuery写法
JavaScript三级联动jQuery写法

热门文章

最新文章