基于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实现手机短信按钮倒计时的全部叙述，希望大家喜欢。

赞 (0)

相关推荐

  • js实现短信发送倒计时功能（正则验证）

    js实现短信发送倒计时功能（正则验证）

    本文实例为大家分享了js短信发送倒计时的具体代码,供大家参考,具体内容如下 <div class="login"> <form action="" method="post"> <div class="login-box"> <p class="pho-0 pho"> <img class="" src="img/icon_

  • js实现5秒倒计时重新发送短信功能

    本文实例讲述了js实现倒计时重新发送短信验证码功能的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js-手机发送短信倒计时</title> <style> button{ width: 100px; height: 30px; border: none

  • 基于JS实现发送短信验证码后的倒计时功能(无视页面刷新，页面关闭不进行倒计时功能)

    相关阅读: 基于jQuery实现发送短信验证码后的倒计时功能(无视页面关闭) 下面一段代码是小编给大家带来的js发送短信验证码后实现倒计时功能,代码简单易懂. 具体代码如下所示: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus

  • 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正则表达式大全(整理详细且实用)

    正则表达式中的特殊字符 字符 含意 \ 做为转意,即通常在"\"后面的字符不按原来意义解释,如/b/匹配字符"b",当b前面加了反斜杆后/\b/,转意为匹配一个单词的边界. -或- 对正则表达式功能字符的还原,如"*"匹配它前面元字符0次或多次,/a*/将匹配a,aa,aaa,加了"\"后,/a\*/将只匹配"a*". ^ 匹配一个输入或一行的开头,/^a/匹配"an A",而不匹配&q

  • JS短信验证码倒计时功能的实现（没有验证码，只有倒计时）

    1.功能描述 当用户想要获取验证码时,就点击 免费获取验证码 ,然后开始倒计时,倒计时期间按钮文字为剩余时间x秒,且不可按状态,倒计时结束后,按钮更改为点击重新发送. 2.分析 必须用到定时器.按钮点击后,在定时器内做出判断.倒计时60秒,到0结束. 3.代码实现: 重点介绍:定时器在进行下一次倒计时之前,一定要清除一下,这样的话保证下一次定时器倒计时是正常的. <!DOCTYPE html> <html> <head> <meta charset="U

  • 比较正宗的验证邮箱的正则表达式js代码详解

    fuchangxi的正则: 复制代码 代码如下: /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/ 开始必须是一个或者多个单词字符或者是-,加上@,然后又是一个或者多个单词字符或者是-.然后是点"."和单词字符和-的组合,可以有一个或者多个组合. 复制代码 代码如下: <script type="text/javascript"> function isEmail(str){ var reg =

  • JS实现用户注册时获取短信验证码和倒计时功能

    JS实现用户注册时获取短信验证码和倒计时功能

    在用户注册时,通常需要短信验证码,而且为了交互效果,也需要增加倒计时. 效果如下: <div class="user-form"> <form action="{{ path('zm_member_register') }}" method="post"> <div class="form-list"> <label class="register-label"&g

  • 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正则函数match、exec、test、search、replace、split使用介绍集合

    js正则函数match、exec、test、search、replace、split使用介绍集合

    match 方法 使用正则表达式模式对字符串执行查找,并将包含查找的结果作为数组返回. stringObj.match(rgExp) 参数 stringObj 必选项.对其进行查找的 String 对象或字符串文字. rgExp 必选项.为包含正则表达式模式和可用标志的正则表达式对象.也可以是包含正则表达式模式和可用标志的变量名或字符串文字. 其余说明与exec一样,不同的是如果match的表达式匹配了全局标记g将出现所有匹配项,而不用循环,但所有匹配中不会包含子匹配项. 例子1: functi

随机推荐