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

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

作者: 表弟_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