前端验证码发送后60s倒计时

 $(\'#getyzm\').click(function(){
                $.ajax({
                    url:\'/zh/yzm/\',
                    type:\'POST\',
                    data:{\'phone\':$(\'#join_id\').val()},
                    success:function(reat){
                        if (reat==1){
                            alert(\'发送成功\');
                            $.cookie(\'yzm\', 60, { expires: 1 });   #发送成功后，向用户设置cookie 防止刷新
                            timekeeping();                          #使函数运行
                        }else{
                            alert(\'验证码发送失败\')
                        }
                    }
                })
            })

 

下面是关于倒计时页面

 1 $(function(){
 2             if($.cookie(\'yzm\')){ 　　　　　　　　　　　　　　 #从cookie中取值，查看验证码是否已经发送
 3                 timekeeping();                             #若发送，则运行此函数
 4             }
 5             else{
 6                 $(\'#getyzm\').attr("disabled", false)      #若未发送，设置取消验证码按钮禁用
 7             }
 8             function timekeeping(){                       # 函数运行
 9                 $(\'#getyzm\').attr("disabled", true);       #设置验证码按钮禁用
10                 var hs=setInterval(function (){             #定义一个函数  每秒运行一次 从cookie中读值。
11                     sj=$.cookie("yzm");
12                     sj=sj-1;
13                     $("#getyzm").val(sj+\'秒后重发\');          #倒计时显示
14                     if(sj==0){                                #若时间到了
15                         $(\'#getyzm\').attr("disabled", false); #设置取消验证码按钮禁用
16                         clearInterval(hs);                     #停止函数，使其不再一秒运行一次
17                         sj=$.cookie("yzm",sj, { expires: -1 });  #删除cookie
18                         $(\'#getyzm\').val("获取验证码");
19                     }else{                                          #若时间未到，将值写入cookie中
20                         $.cookie(\'yzm\', sj, { expires: 1 });
21                     }
22                 },1000);
23             }
　　　　　　}

需引入jQuery.cookie.js

<input type=\'button\' disabled=\'disabled\' id=\'getyzm\' value=\'获取验证码\'>