60s倒计时（原生js版）
Posted 喜欢骑车的大冬瓜
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了60s倒计时（原生js版）相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.chaxun-yanzhengma-btn{
border-radius: 4px;
background-color: #FF4179;
border: 2px solid #c81352;
color: #FFFFFF;
}
</style>
</head>
<body>
<input class="chaxun-yanzhengma-btn" type="button" value="获取验证码" />
<script>
var btn = document.querySelector(‘.chaxun-yanzhengma-btn‘);
var timer;
btn.onclick=function(){
clearInterval(timer);
var tip = 6;
btn.disabled = ‘disabled‘;
btn.value = tip + ‘s后重新发送‘;
btn.style.background = ‘#eee‘;
btn.style.color = ‘#666‘;
btn.style.borderColor = ‘#aaa‘;
timer = setInterval(function(){
tip--
if( tip == 0 ){
btn.disabled = false;
btn.value = ‘获取验证码‘;
btn.style.background = ‘#FF4179‘;
btn.style.color = ‘#fff‘;
btn.style.borderColor = ‘#c81352‘;
clearInterval(timer);
return false;
}
btn.value = tip + ‘s后重新发送‘
},1000);
}
</script>
</body>
</html>
以上是关于60s倒计时（原生js版）的主要内容，如果未能解决你的问题，请参考以下文章