验证码的倒计时

html部分

<div>
<p>倒计时:</p>
<input type="button" id="btn" value="获取验证码" onclick="settime(this)"/>

</div>

css部分

[type="button"]{
border:1px solid #f39800 ;
color: #f39800;
outline: none;
}

js部分

var seconds=60;
function settime(val){
var btn=document.getElementById('btn')
if(seconds == 0){
val.removeAttribute("disabled");
val.value="免费获取验证码";
$('#btn').css('border-color','#F39800');
}else {
val.setAttribute("disabled", true);
val.value="重新发送(" + seconds + ")";
seconds--;
$('#btn').css('border-color','#2378e1');
$('#btn').css('color','#2378e1');
}
setTimeout(function() {
settime(val)
},1000)
}

posted @ 2017-05-22 09:26  阳光透过幸福  阅读(97)  评论(0编辑  收藏  举报