親測有效!
1.html代碼
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/jquery.js"></script>
<script src="http://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<div class="cj-text"><label>手機號碼<b>* </b></label><input name="" type="text" id="mobile"></div>
<div class="cj-text reg-dx"><label>短信驗證碼<b>* </b></label><input class="reg-dx-t" name="" type="text" id="mobileYzm">
<button class="layui-btn" type="button" id="send" οnclick="getCode()" lay-submit lay-filter="formDemo">發送驗證碼</button>
</div>
2.js代碼
<script> //發送驗證碼時添加cookie function addCookie(name,value,expiresHours){ //判斷是否設置過期時間,0代表關閉瀏覽器時失效 if(expiresHours>0){ var date=new Date(); date.setTime(date.getTime()+expiresHours*1000); $.cookie(name, escape(value), {expires: date}); }else{ $.cookie(name, escape(value)); } } //修改cookie的值 function editCookie(name,value,expiresHours){ if(expiresHours>0){ var date=new Date(); date.setTime(date.getTime()+expiresHours*1000); //單位是毫秒 $.cookie(name, escape(value), {expires: date}); } else{ $.cookie(name, escape(value)); } } //根據名字獲取cookie的值 function getCookieValue(name){ return $.cookie(name); } //加載頁面時獲取Cookie並判斷 $(document).ready(function(){ var obj1 = $("#send"); v = getCookieValue("secondsremained");//獲取cookie值 if(v>0){ settime(obj1);//開始倒計時 } }); //定義倒計時變量 var countdown; //點擊函數 function getCode() { var phone = $("#phone").val(); var obj = $("#send"); var checkPhone = /^1[34578]\d{9}$/; if(!checkPhone.test(phone)){ layer.msg('手機號碼格式錯誤!'); $('#phone').focus(); return false; } if (phone) { addCookie("secondsremained", 60, 60);//添加cookie記錄,有效時間60s settime(obj);//開始倒計時 } } // 倒計時函數 function settime(obj) { //發送驗證碼倒計時 countdown=getCookieValue("secondsremained"); if (countdown === "0") { obj.attr('disabled',false); //obj.removeattr("disabled"); obj.text("點擊獲取驗證碼"); return; } else { obj.attr('disabled',true); obj.text("重新發送(" + countdown + ")"); countdown--; editCookie("secondsremained",countdown,countdown+2); } setTimeout(function() { settime(obj) } ,1000) } </script>