JS 简单封装cookie 与jQuery使用cookie

创建和存储cookie

// 函数中的参数分别为 cookie 的名称、值以及过期天数
// 时间如果不确定的话  可以时间单独拿出来 
function setCookie(c_name,value,expiredays){
    var exdate=new Date();
    exdate.setDate(exdate.getDate()+expiredays);
    document.cookie=c_name+ "=" +escape(value)+
    ((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}
setCookie('name','zzyn',1); // cookie过期时间为1天。
 
// 如果要设置过期时间以秒为单位
function setCookie(c_name,value,expireseconds){
    var exdate=new Date();
    exdate.setTime(exdate.getTime()+expireseconds * 1000);
    document.cookie=c_name+ "=" +escape(value)+
    ((expireseconds==null) ? "" : ";expires="+exdate.toGMTString())
}
setCookie('name','zzyn',3600);  //cookie过期时间为一个小时

或者简单的创建和存储cookie

 

 

读取cookie

// 函数中的参数为 要获取的cookie键的名称。
function getCookie(c_name){
    if (document.cookie.length>0){
        c_start=document.cookie.indexOf(c_name + "=");
        if (c_start!=-1){
            c_start=c_start + c_name.length+1;
            c_end=document.cookie.indexOf(";",c_start);
            if (c_end==-1){ 
                c_end=document.cookie.length;
            }
 
            return unescape(document.cookie.substring(c_start,c_end));
        }
     }
 
    return "";
}
var uname= getCookie('name');

 

或者简单的方法读取cookie

var getCookie = document.cookie = 'name'

 

判断cookie是否存在

// 函数中的参数为，要判断的cookie名称
 function checkCookie(c_name){
    username=getCookie(c_name);
    if (username!=null && username!=""){
        // 如果cookie值存在，执行下面的操作。
        alert('Welcome again '+username+'!');
    }else{
        username=prompt('Please enter your name:',"");
        if (username!=null && username!=""){
            //如果cookie不存在，执行下面的操作。
            setCookie('username',username,365)
        }   
    }

 

 

jQuery使用插件操作cookie 

首先要引入jquery的库文件，之后再引入 jquery.cookie.js 的库文件，顺序不可颠倒。 

<script src="jquery-1.11.3.js" type="text/javascript"></script>
<script src="jquery.cookie.js" type="text/javascript"></script>

使用方法 

1.新添加一个会话 cookie： 

$.cookie('the_cookie', 'the_value');

注：当没有指明 cookie有效时间时，所创建的cookie有效期默认到用户关闭浏览器为止，所以被称为 

“会话cookie（session cookie）”。 

2.创建一个cookie并设置有效时间为 7天: 

$.cookie('the_cookie', 'the_value', { expires: 7 });

注：当指明了cookie有效时间时，所创建的cookie被称为“持久 cookie （persistent cookie）”。 

3.创建一个cookie并设置 cookie的有效路径： 

$.cookie('the_cookie', 'the_value', { expires: 7, path: '/' });

注：在默认情况下，只有设置 cookie的网页才能读取该 cookie。如果想让一个页面读取另一个页面设 

置的cookie，必须设置cookie的路径。cookie的路径用于设置能够读取 cookie的顶级目录。将这 

个路径设置为网站的根目录，可以让所有网页都能互相读取 cookie （一般不要这样设置，防止出现冲突） 。 

4.读取cookie： 

$.cookie('the_cookie'); // cookie存在 => 'the_value' 
$.cookie('not_existing'); // cookie不存在 => null

5.删除cookie，通过传递null作为cookie的值即可： 

$.cookie('the_cookie', null);

----------相关参数的解释--------------- 

1).expires: 365 

定义cookie的有效时间，值可以是一个数字（从创建cookie时算起，以天为单位）或一个Date 对象。

如果省略，那么创建的cookie是会话cookie，将在用户退出浏览器时被删除。 

2).path: '/' 

默认情况：只有设置cookie的网页才能读取该cookie。 

定义cookie的有效路径。默认情况下， 该参数的值为创建 cookie 的网页所在路径（标准浏览器的行为） 。 

如果你想在整个网站中访问这个cookie需要这样设置有效路径：path: '/'。如果你想删除一个定义 

了有效路径的 cookie，你需要在调用函数时包含这个路径:$.cookie('the_cookie', null, 

{ path: '/' });。 domain: 'example.com' 

默认值：创建 cookie的网页所拥有的域名。 

3).secure: true 

默认值：false。如果为true，cookie的传输需要使用安全协议（HTTPS）。 

4).raw: true 

默认值：false。 

默认情况下，读取和写入 cookie 的时候自动进行编码和解码（使用encodeURIComponent 编码， 

decodeURIComponent 解码）。要关闭这个功能设置 raw: true 即可。

 

 

 

 

 

 

 

 

 

 

 

cookie