美文网首页
简单粗暴实现手机验证码倒计时

简单粗暴实现手机验证码倒计时

作者: 表弟_212 | 来源:发表于2019-02-11 14:33 被阅读0次
    image.png
    <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=10;  
    function settime(val) {  
        if (countdown == 0) {  
            val.removeAttribute("disabled");  
            val.value="获取验证码";  
            countdown = 10;  
            return false;  
        } else {  
            val.setAttribute("disabled", true);  
            val.value="重新发送(" + countdown + ")";  
            countdown--;  
        }  
        setTimeout(function() {  
            settime(val);  
        },1000);  
    }  
    </script>
    
    

    相关文章

      网友评论

          本文标题:简单粗暴实现手机验证码倒计时

          本文链接:https://www.haomeiwen.com/subject/yzjqeqtx.html