js短信验证倒计时

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
  <style type="text/css">
   *{
    margin: 0;
    padding: 0;
   }
   button{
    width: 100px;
   }
  </style>
  <script type="text/javascript">
   window.onload = function(){
    var btn = document.getElementById('btn');
    btn.onclick = function(){
     this.disabled = true;
     var count = 5;
     var timer = null;
      timer = setInterval(send,1000);
      function  send(){
      count--;
      if(count>=0){
       btn.innerHTML = '还剩'+count+'s';
      }
      else{
       btn.disabled = false;
       btn.innerHTML = '重新发送短信';
       clearInterval(timer);
       count=5;
      }
     }
     
    }
    
   }
  </script>
 </head>
 <body>
  <input type="text" /><button id="btn">发送短信验证</button>
 </body>
</html>

posted @ 2018-03-12 13:57  丢嫂  阅读(110)  评论(0编辑  收藏  举报