When js is used to obtain the verification code 60 s, it will be sent again

We often have the function of obtaining the verification code when registering or logging on to the page. When obtaining the verification code, we often need to do a 60 s click prohibition function, the following code is frequently used in projects:

Example

Button for obtaining verification:

The code is as follows:

Copy code

<Input class = "get" type = "button" value = "get verification code"/>; Ajax function for obtaining the verification code: $ (". Get"). on ('click', function (){ Var btn = $ (this ); Var phone = $ (". phone"). val (); Var data = {phone: phone, type: 1 };   If (! Phone |! Eval ('/' + regexEnum. mobile + '/'). test (phone) | Phone. length & amp; lt; 11 ){ Alert ("incorrect mobile phone number format! "); Return; } // Obtain the verification code through ajax AjaxPOSTRequest (kBaseUserUrl + "getPhoneSalt", data, handleCaptcha ); Function handleCaptcha (result ){ ZMAlert (result. message ['content']); If (result. errorCode = 0 ){ Settime (btn ); } } });

60 s Countdown function:

The code is as follows:	Copy code
Var countdown = 60; Function settime (val ){ If (countdown = 0 ){ Val. attr ("disabled", false ); Val. val ("resend "); Val.css ({ "Background": "# fe8836" }); Countdown = 60; Return false; } Else { Val. attr ("disabled", true ); Val. val ("getting" + countdown ); Val.css ({ "Background": "# ccc" }); Countdown --; } SetTimeout (function (){ Settime (val) }, 1000) }

 

Example 1

The code is as follows:

Copy code

Javascriptvar getCode = document. getElementById ('getcode '); Var wait = 60; Function time (btn ){ If (wait = 0 ){ Btn. removeAttribute ("disabled "); Btn. innerHTML = "get verification code "; Wait = 60; } Else { Btn. setAttribute ("disabled", true ); Btn. innerHTML = wait + "retry in seconds "; Wait --; SetTimeout (function (){ Time (btn ); },1000 );     } } GetCode. onclick = function (){ Time (this ); };