Click the button to send the verification code and a simple example of countdown appears

  • 2021-08-05 07:59:18
  • OfStack

Examples are as follows:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script src="jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
 
var InterValObj; //timer Variable, control time  
var count = 30; // Interval function, 1 Second execution  
var curCount;// Current number of seconds remaining  
 
function sendMessage() { 
    curCount = count; 
        // Settings button Effect, start timing  
   $("#btnSendCode").attr("disabled", "true"); 
   $("#btnSendCode").val(curCount + " Second to resend "); 
   InterValObj = window.setInterval(SetRemainTime, 1000); // Start the timer, 1 Second execution 1 Times  
          
  // Request the background to send the verification code  TODO 
 
} 
 
//timer Handler function  
function SetRemainTime() { 
      if (curCount == 0) {         
        window.clearInterval(InterValObj);// Stop timer  
        $("#btnSendCode").removeAttr("disabled");// Enable button  
        $("#btnSendCode").val(" Resend verification code "); 
      } 
      else { 
        curCount--; 
        $("#btnSendCode").val(curCount + " Second to resend "); 
      } 
    } 
</script> 
</head> 
<body> 
    <input id="btnSendCode" type="button" value=" Send verification code " onclick="sendMessage()" /></p> 
</body> 
</html> 

Related articles: