一个JS代码实现按钮倒计时功能的实例

96
计科学堂
2019-05-14 14:43:14 浏览次数:0

一个JS代码实现按钮倒计时功能的实例


 实现点击获取验证码倒计时效果
<input type="button" id="btn" value="免费获取验证码" />
<script type="text/javascript">
var wait=60;
function time(o) {
  if (wait == 0) {
   o.removeAttribute("disabled");   
   o.value="免费获取验证码";
   wait = 60;
  } else { 

   o.setAttribute("disabled", true);
   o.value="重新发送(" + wait + ")";
   wait--;
   setTimeout(function() {
    time(o)
   },
   1000)
  }
 }
document.getElementById("btn").onclick=function(){time(this);}
</script>


另一种相同的写法,只是js上有几点不同。

<input type="button" id="btn" value="免费获取验证码" onclick="settime(this)" /> 
<script type="text/javascript"> 
var countdown=10; 
function settime(val) { 
if (countdown == 0) { 
val.removeAttribute("disabled");    
val.value="免费获取验证码"; 
countdown = 10; 
if(countdown==10){
return;
}
    } else { 
val.setAttribute("disabled", true); 
      val.value="重新发送(" + countdown + ")"; 
countdown--; 
   } 
   
setTimeout(function() { 
settime(val)},1000) 
} 
</script>

关键词:js按钮倒计时
  [错误报告] [推荐] [收藏] [打印] [关闭] [返回顶部]