基于JavaScript实现手机短信按钮倒计时(超简单)
在淘宝等购物网站,我们都会看到一个发送短信倒计时的按钮,究竟是如何实现的呢?下面我就给大家提供一段代码很实用的。
废话不多说了,直接给大家贴js代码了。
/* 120秒手机短信按钮倒计时 */ exports.sendmessage = function (name) { var second = 120; $(name).attr("disabled", true); var color = $(name).css('background-color'); $(name).attr("style", "background-color : #c1c1c1"); function update(num) { if (num == second) { $(name).attr("style", "background-color : "+color); $(name).text("获取验证码"); $(name).attr("disabled", false); } else { var printnr = second - num; $(name).text(printnr + "秒后获取"); } } function uupdate(i) { return function () { update(i); } } for (var i = 1; i <= second; i++) { setTimeout(uupdate(i), i * 1000); } }
以上代码是本文给大家介绍的JavaScript实现手机短信按钮倒计时的全部叙述,希望大家喜欢。
相关推荐
-
基于JS实现发送短信验证码后的倒计时功能(无视页面刷新,页面关闭不进行倒计时功能)
相关阅读: 基于jQuery实现发送短信验证码后的倒计时功能(无视页面关闭) 下面一段代码是小编给大家带来的js发送短信验证码后实现倒计时功能,代码简单易懂. 具体代码如下所示: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus
-
js实现短信发送倒计时功能(正则验证)
本文实例为大家分享了js短信发送倒计时的具体代码,供大家参考,具体内容如下 <div class="login"> <form action="" method="post"> <div class="login-box"> <p class="pho-0 pho"> <img class="" src="img/icon_
-
比较正宗的验证邮箱的正则表达式js代码详解
fuchangxi的正则: 复制代码 代码如下: /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/ 开始必须是一个或者多个单词字符或者是-,加上@,然后又是一个或者多个单词字符或者是-.然后是点"."和单词字符和-的组合,可以有一个或者多个组合. 复制代码 代码如下: <script type="text/javascript"> function isEmail(str){ var reg =
-
JS实现用户注册时获取短信验证码和倒计时功能
在用户注册时,通常需要短信验证码,而且为了交互效果,也需要增加倒计时. 效果如下: <div class="user-form"> <form action="{{ path('zm_member_register') }}" method="post"> <div class="form-list"> <label class="register-label"&g
-
js正则函数match、exec、test、search、replace、split使用介绍集合
match 方法 使用正则表达式模式对字符串执行查找,并将包含查找的结果作为数组返回. stringObj.match(rgExp) 参数 stringObj 必选项.对其进行查找的 String 对象或字符串文字. rgExp 必选项.为包含正则表达式模式和可用标志的正则表达式对象.也可以是包含正则表达式模式和可用标志的变量名或字符串文字. 其余说明与exec一样,不同的是如果match的表达式匹配了全局标记g将出现所有匹配项,而不用循环,但所有匹配中不会包含子匹配项. 例子1: functi
-
JS正则表达式大全(整理详细且实用)
正则表达式中的特殊字符 字符 含意 \ 做为转意,即通常在"\"后面的字符不按原来意义解释,如/b/匹配字符"b",当b前面加了反斜杆后/\b/,转意为匹配一个单词的边界. -或- 对正则表达式功能字符的还原,如"*"匹配它前面元字符0次或多次,/a*/将匹配a,aa,aaa,加了"\"后,/a\*/将只匹配"a*". ^ 匹配一个输入或一行的开头,/^a/匹配"an A",而不匹配&q
-
js实现5秒倒计时重新发送短信功能
本文实例讲述了js实现倒计时重新发送短信验证码功能的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js-手机发送短信倒计时</title> <style> button{ width: 100px; height: 30px; border: none
-
javascript 手机号码正则表达式验证函数 原创
复制代码 代码如下: function checkMobile(){ var sMobile = document.mobileform.mobile.value if(!(/^1[3|4|5|8][0-9]\d{4,8}$/.test(sMobile))){ alert("不是完整的11位手机号或者正确的手机号前七位"); document.mobileform.mobile.focus(); return false;
-
js发送短信倒计时的简单实现方法
如下所示: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <meta charset="utf-8"> &l
-
JS短信验证码倒计时功能的实现(没有验证码,只有倒计时)
1.功能描述 当用户想要获取验证码时,就点击 免费获取验证码 ,然后开始倒计时,倒计时期间按钮文字为剩余时间x秒,且不可按状态,倒计时结束后,按钮更改为点击重新发送. 2.分析 必须用到定时器.按钮点击后,在定时器内做出判断.倒计时60秒,到0结束. 3.代码实现: 重点介绍:定时器在进行下一次倒计时之前,一定要清除一下,这样的话保证下一次定时器倒计时是正常的. <!DOCTYPE html> <html> <head> <meta charset="U
随机推荐
- 关于.NET动态代理的介绍和应用简介
- Flex中如何动态生成DataGrid以及动态生成表头
- perl 调试命令的相关知识小结
- 深入分析:用1K内存实现高效I/O的RandomAccessFile类的详解
- python中如何使用正则表达式的非贪婪模式示例
- JavaScript 另类遍历数组实现代码
- Bootstrap实现渐变顶部固定自适应导航栏
- PHP在字符断点处截断文字的实现代码
- 如何使用GDB调试PHP程序
- C#获取路由器外网IP,MAC地址的实现代码
- Bootstrap源码解读导航(6)
- PHP安全配置详细说明
- 12个超实用的JQuery代码片段
- Android自定义UI手势密码终结版
- [转]超级站长精典语录!
- 使用Android自定义控件实现滑动解锁九宫格
- python使用pil进行图像处理(等比例压缩、裁剪)实例代码
- Java获取json数组对象的实例讲解
- Android图片或拍照选择图片功能实例代码
- SpringBoot微信消息接口配置详解