用Cookie来实现计时器（发送手机验证码、邮箱）

admin

当我们在一个网站上注册时，要根据手机号码来获取验证码，而验证码中包括一个时间计数器。我们用普通的Js时间时间计数时就会出现当我们刷新页面的时候验证码计数器部消失了。所以这里我们想到了用Js来操作Cookie信息来实现保存时间计数器。具体实现如下代码：
Html中嵌入一个时间计数器

1. <div class="widget-content" id="demo1">
   
2. <span style="white-space:pre">        </span><input type="button" value="获取验证码">
   
3. </div>

复制代码

js代码：

1. <script type="text/javascript">
   
2.       
   
3.         function times(){
   
4.                 var time = getCookie("time");
   
5.                 if(time == null){
   
6.                         time = 60;
   
7.                 }
   
8.                 time--;
   
9.                 setCookie("time", time);
   
10.                
    
11.                 //设置页面样式
    
12.                 $("#demo1").html(time+"秒后重新获取");
    
13.                 //过1秒递归调用times()函数
    
14.                 var funcs = setTimeout("times()", 1000);
    
15.                
    
16.                 if ( time <= 0 ){
    
17.                         //删除Cookie中的值
    
18.                         delCookie("time");
    
19.                         //删除递归调用函数
    
20.                         clearTimeout(funcs);
    
21.                         $("#demo1").html("重新发送");
    
22.                 }
    
23.         }
    
24.       
    
25.         //设计Cookie的值
    
26.         function setCookie(name,value){
    
27.             var Days = 30;
    
28.             var exp = new Date();
    
29.             exp.setTime(exp.getTime() + Days*24*60*60*1000);
    
30.             document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
    
31.         }
    
32.       
    
33.         //获取Cookie的值
    
34.         function getCookie(name){
    
35.             var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
    
36.          
    
37.             if(arr=document.cookie.match(reg))
    
38.                 return unescape(arr[2]);
    
39.             else
    
40.                 return null;
    
41.         }
    
42.       
    
43.         //删除Cookie中的值
    
44.         function delCookie(name){
    
45.             var exp = new Date();
    
46.             exp.setTime(exp.getTime() - 1);
    
47.             var cval=getCookie(name);
    
48.             if(cval!=null)
    
49.                 document.cookie= name + "="+cval+";expires="+exp.toGMTString();
    
50.         }
    

复制代码

这样就可以了。