js验证码倒计时
2021-06-23 10:06
标签:setattr settime 获取 color his 验证码 element attr btn 发送验证码倒计时效果 js验证码倒计时 标签:setattr settime 获取 color his 验证码 element attr btn 原文地址:http://www.cnblogs.com/zywaf/p/7162042.htmlDOCTYPE html>
html lang="en">
head>
meta charset="UTF-8">
title>验证码的倒计时title>
style type="text/css">
*{ margin: 0; padding: 0}
#btn{
background: #fff;
border-radius: 20%;
text-align: center;
font-size: 18px;
font-weight: bold;
color: #fff;
margin: 100px auto;
height: 50px;
width: 150px;
color: #000;
}
#btn.set {
background: #666;
color: #fff;
}
style>
head>
body>
input type="button" id="btn" value="免费获取验证码" />
script type="text/javascript">
var wait=12;
function time(o) {
if (wait == 0) {
o.removeAttribute("disabled");
o.className = "";
o.value="免费获取验证码";
wait = 12;
}
else {
if(wait10){
o.value="重新发送(0"+wait+")";
wait--;
setTimeout(function() {
time(o)
},1000)
}
else{
o.setAttribute("disabled", true);
o.className = "set";
o.value="重新发送(" + wait + ")";
wait--;
setTimeout(function() {
time(o)
},1000)
}
}
}
document.getElementById("btn").onclick=function(){
time(this);
}
script>
body>
html>
下一篇:CSS技巧收集——毛玻璃效果