<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>发送验证码练习</title>
<style type="text/css">
.nosend{width: 120px;height: 50px;background-color: #999999;color: #FFFFFF;margin: 30px 400px;}
.send{width: 120px;height: 50px;background-color: #0C4E7C;color: #FFFFFF;margin: 30px 400px;}
</style>
</head>
<body>
<input type="button" id="send" value="发送验证码" class="send"/>
</body>
<script type="text/javascript">
var mybtn=document.getElementById("send");
var timer=null;
var index=10;
mybtn.onclick=function(){
if(timer){clearInterval(timer);timer=null;}
mybtn.setAttribute("disabled","disabled");
mybtn.setAttribute("class","nosend");
timer=setInterval(function(){
index--;
mybtn.value=index+"后重新发送";
if(index<0){
clearInterval(timer);
mybtn.removeAttribute("disabled");
mybtn.setAttribute("class","send");
mybtn.value="重新发送验证码";
index=10;
}
},1000);
}
</script>
</html>这是完整代码，有一个BUG，在火狐浏览器里第一次运行正常，当刷新页面的时候会自动加上一个disabled属性，而在谷歌浏览器里就正常，这是为什么呢？
还有，提示里的disabled属性设置为‘true’或‘false’好像并不管用。
window.onload=function(){
var send=document.getElementById('send'),
times=60,
timer=null;
send.onclick=function(){
timer=setInterval(function(){
times--;
if(times<=0){
send.value="发送验证码"
clearInterval(timer);
send.disabled=""
times=60;
}else{
send.value=times+"秒后重试";
send.disabled="disabled"
}
},1000)
// 计时开始
}
}
自认为代码很简单，你试试，
看不懂