• js获取手机验证码倒计时的实现


    原文地址http://blog.csdn.net/hj7jay/article/details/51433828

    方案1:

    <div class="div user-input">  
      <input type="number" class="code" name="verify" placeholder="请输入手机验证码" required maxlength="6">  
      <input type="button" class="obtain generate_code" value=" 获取验证码">  
    </div>  
    <script type="text/javascript">  
      $(function(){  
        $(".generate_code").click(function(){  
          var disabled = $(".generate_code").attr("disabled");  
          if(disabled){  
            return false;  
          }  
          if($("#mobile").val() == "" || isNaN($("#mobile").val()) || $("#mobile").val().length != 11 ){  
            alert("请填写正确的手机号!");  
            return false;  
          }  
          $.ajax({  
            async:false,  
            type: "GET",  
            url: "{:U('User/sms')}",  
            data: {mobile:$("#mobile").val()},  
            dataType: "json",  
            async:false,  
            success:function(data){  
              console.log(data);  
              settime();  
            },  
            error:function(err){  
              console.log(err);  
            }  
          });  
        });  
        var countdown=60;  
        var _generate_code = $(".generate_code");  
        function settime() {  
          if (countdown == 0) {  
            _generate_code.attr("disabled",false);  
            _generate_code.val("获取验证码");  
            countdown = 60;  
            return false;  
          } else {  
            $(".generate_code").attr("disabled", true);  
            _generate_code.val("重新发送(" + countdown + ")");  
            countdown--;  
          }  
          setTimeout(function() {  
            settime();  
          },1000);  
        }  
      })  
      
    </script>

    方案2:

    <div class="div user-input">  
      <input type="number" class="code" placeholder="请输入手机验证码" required maxlength="6">  
      <input type="button" class="obtain generate_code" value=" 获取验证码" onclick="settime(this);">  
    </div>  
    <script type="text/javascript">  
      
    //倒计时  
    var countdown=60;  
    function settime(val) {  
        if (countdown == 0) {  
            val.removeAttribute("disabled");  
            val.value="获取验证码";  
            countdown = 60;  
            return false;  
        } else {  
            val.setAttribute("disabled", true);  
            val.value="重新发送(" + countdown + ")";  
            countdown--;  
        }  
        setTimeout(function() {  
            settime(val);  
        },1000);  
    }  
    </script>
    对上述的代码,有任何疑问,可以在下方留言。 也可以给我发邮件咨询:673658917@qq.com 或者是直接加qq:673658917 转载请注明出处,谢谢合作。 睡觉舒服,那是给死人准备的,加油吧,一年后你会感谢现在的自己的。
  • 相关阅读:
    lintcode-144-交错正负数
    lintcode-143-排颜色 II
    lintcode-142-O(1)时间检测2的幂次
    lintcode-141-x的平方根
    lintcode-138-子数组之和
    postman-----使用CSV和Json文件实现批量接口测试
    postman—创建collection,执行collection和批量执行
    postman-变量
    postman-鉴权
    Postman—cookie
  • 原文地址:https://www.cnblogs.com/lishanshan/p/9999553.html
Copyright © 2020-2023  润新知