当前位置：网站首页>The native JS mobile phone sends SMS cases. After clicking the button, the mobile phone number verification code is sent. The button needs to be disabled and re enabled after 60 seconds

The native JS mobile phone sends SMS cases. After clicking the button, the mobile phone number verification code is sent. The button needs to be disabled and re enabled after 60 seconds

2022-06-25 19:32:00 【Good first】

Insert picture description here 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
     <!-- 
        demand ： Click the button and send the mobile number verification code , The button needs to be disabled , also 60 Re enable in seconds 
      -->
     
   cell-phone number ：<input type="text">  <button> send out </button>

    <script>
      var btn = document.querySelector('button')
       var time = 59 ;
      btn.addEventListener('click' , function () {
    
          btn.disabled = true ; //  Disable button ;

       var timer =  setInterval(() => {
    
              if (time == 0) {
    
                  //  Clear timer and reset button 
                  clearInterval(timer);
             btn.disabled = false ; //  Enable button ;
             time = 59 ; //  Need to re enable 
             btn.innerHTML = ' send out '
              }else{
    
                btn.innerHTML = ' There is still left ' + time + ' second '
                     time -- ;
              }
          }, 1000);
      })
    </script>
</body> 
</html>
原网站

版权声明
本文为[Good first]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/02/202202190519033010.html

边栏推荐

猜你喜欢

随机推荐