JS realizes the countdown function after sending the verification code _javascript skill

Previously shared only use JS to achieve the countdown function, later, when the test found, refresh or close the page, the countdown can not be used. Online also did not find the right solution, so I wrote a, this is an optimization version of it, can meet the refresh or reopen the Web page, the countdown can still be used

Special Note:

The valid time the cookie was originally created is 60 seconds. In other words, if you close the Web page when the countdown is 20, it will not have a countdown to it after 20 seconds. However, if the countdown to 20 o'clock, close the page, if in 20 seconds to reopen the page, there is a countdown to display.

HTML code

<input id= "Second" type= "button" value= "Free access to authentication code"/>

The operation of JS to cookies

Adds a cookie function Addcookie (name,value,expireshours) {var cookiestring=name+ "=" +escape (value) when sending a captcha; 
    Determines whether or not to set an expiration time, 0 represents the invalidation if (expireshours>0) {var date=new date () when the browser is closed; 
    Date.settime (Date.gettime () +expireshours*1000); 
  cookiestring=cookiestring+ "; expires=" + date.toutcstring (); 
} document.cookie=cookiestring; 
  //Modify the value of the cookie function Editcookie (name,value,expireshours) {var cookiestring=name+ "=" +escape (value); 
   if (expireshours>0) {var date=new date (); Date.settime (Date.gettime () +expireshours*1000); 
  Unit is millisecond cookiestring=cookiestring+ "; expires=" + date.togmtstring (); 
} document.cookie=cookiestring; 
   /////The value of the cookie obtained by name function Getcookievalue (name) {var Strcookie=document.cookie; 
   var arrcookie=strcookie.split (";"); 
    for (Var i=0;i<arrcookie.length;i++) {var arr=arrcookie[i].split ("=");
     if (arr[0]==name) {return unescape (arr[1]);
    Break 
       }else{return "";
     Break 
   } 
   } 
}
 

Primary Logical code

$ (function () {$ ("#second"). Click (function () {Sendcode ($ ("#second"));
  }); v = getcookievalue ("secondsremained");//Get Cookie value if (v>0) {settime ($ ("#second"))//Start Countdown}}//send validation code function
  Sendcode (obj) {var phonenum = $ ("#phonenum"). Val ();
  var result = Isphonenum ();
    if (result) {dopostback (' ${base}/login/getcode.htm ', backfunc1,{' Phonenum ':p honenum}); Addcookie ("secondsremained", 60,60)//Add cookie record, valid time 60s settime (obj);//Start Countdown}///Send mobile phone using AJAX to background SMS interface function DoP Ostback (Url,backfunc,queryparam) {$.ajax ({async:false, cache:false, type: ' POST ', url:url,//request
The action path Data:queryparam, Error:function () {//Request failure Handler}, success:backfunc});
  function BackFunc1 (data) {var d = $.parsejson (data);
  if (!d.success) {alert (d.msg);
    }else{//Return Validation code alert ("Analog Verification Code:" +d.msg);
  $ ("#code"). Val (d.msg);
}//Start countdown var countdown;
  function SetTime (obj) {countdown=getcookievalue ("secondsremained"); If (Countdown = 0)  
    {obj.removeattr ("disabled"); 
    Obj.val ("Free access to Verification code");
  Return 
    else {obj.attr ("disabled", true); 
    Obj.val ("Re-send (" + Countdown +) ");
    countdown--;
  Editcookie ("secondsremained", countdown,countdown+1); } settimeout (function () {settime (obj)},1000)//Every 1000 milliseconds}///Verify that the phone number is legal function isphonenum () {var phonenum = $ ("
  #phonenum "). Val (); var Myreg =/^ ((13[0-9]{1}) | ( 15[0-9]{1}) | (18[0-9]{1})) 
  +\D{8}) $/; if (!myreg.test (phonenum)) {alert (' Please enter a valid cell phone number!) 
    '); 
  return false;
  }else{return true;
 }
}

The above is the entire contents of this article, I hope you can enjoy.