jquery plug-in implementation "Click to obtain the verification code 60 seconds to prevent re-acquisition (anti-refresh)"
:
First to the official website (http://plugins.jQuery.com/cookie/) Download the cookie plugin, put in the corresponding folder, the code is as follows:
1 <style type= "Text/css" >2 * {margin:0;3 padding:0;4 font-family:"Microsoft Yahei";5}6 . Captcha-box{7 width:360px;8 Height:34px;9 margin:30px;Ten padding:30px; One Border:#956E6F 1px dashed; A Border-radius:5px; - Background-color:#FAF2F2; -} the #mobile{ - float: Left; - width:180px; - Height:32px; + Border:#e5e5e5 1px solid; - Line-height:32px; + text-indent:8px; A Outline:None; at} - #getting{ - float: Left; - Height:34px; - Margin-left:-1px; - padding:0 18px; in text-align:Center; - Line-height:34px; to Border:#e5e5e5 1px solid; + background:linear-gradient (0deg, #f4f2f2 0, #fbf9f9 100%);cursor:Pointer;Outline:None;} - </style>
1 <Divclass= "Captcha-box"> 2 <inputtype= "text"ID= "mobile"maxlength= "One"placeholder= "Please enter mobile phone number"> 3 <inputtype= "button"ID= "getting"value= "Get Verification Code"> 4 </Div>
1<script src= "Http://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js" ></script>2<script src= "Jquery.cookie.js" ></script>3<script>4$(function(){ 5 6 /*Imitation Refresh: Detects whether a cookie exists*/ 7 if($.cookie ("Captcha")){ 8 varCount = $.cookie ("Captcha"); 9 varBTN = $ (' #getting '); TenBtn.val (count+ ' second to regain '). attr (' disabled ',true). CSS (' cursor ', ' not-allowed ')); One varResend = SetInterval (function(){ Acount--; - if(Count > 0){ -Btn.val (count+ ' second to regain '). attr (' disabled ',true). CSS (' cursor ', ' not-allowed ')); the$.cookie ("Captcha", Count, {path: '/', Expires: (1/86400) *count}); -}Else { - clearinterval (Resend); -Btn.val ("Get Verification Code"). Removeclass (' disabled '). Removeattr (' disabled style ')); + } -}, 1000); + } A at /*Click the Change button State, has been abbreviated AJAX send SMS Verification code*/ -$ (' #getting '). Click (function(){ - varBTN = $ ( This); - varCount = 60; - varResend = SetInterval (function(){ -count--; in if(Count > 0){ -Btn.val (count+ "Seconds to regain"); to$.cookie ("Captcha", Count, {path: '/', Expires: (1/86400) *count}); +}Else { - clearinterval (Resend); theBtn.val ("Get Verification Code"). Removeattr (' disabled style ')); * } $}, 1000); Panax NotoginsengBtn.attr (' disabled ',true). CSS (' cursor ', ' not-allowed ')); - }); the + }); A</script>
jquery Plugin anti-refresh countdown "Click to get verification code after 60 seconds to prohibit re-acquisition