jquery cookies操作实例

发布时间:2020-10-28编辑:脚本学堂
本文介绍了jquery cookie操作的相关实例,jquery操作cookie的插件用法,有需要的朋友参考下。

jquery操作cookie的插件:
 

复制代码 代码示例:
$.cookie('the_cookie'); //读取cookie值 
$.cookie('the_cookie', 'the_value'); //设置cookie的值 
$.cookie('the_cookie', 'the_value', {expires: 7, path: '/', domain: 'jquery.com', secure: true});//新建一个cookie 包括有效期 路径 域名等 
$.cookie('the_cookie', 'the_value'); //新建cookie 
$.cookie('the_cookie', null); //删除一个cookie 
 

设置一个名称为exist,值为exist的cookie:
 

复制代码 代码示例:
$.cookie("exist", "exist"); 
 

设置一个名称为exist,值为exist的cookie,同时设置过期时间(expires属性)为7天:
 

复制代码 代码示例:
$.cookie("exist", "exist", { expires: 7 }); 
 

设置一个名称为exist,值为exist的cookie,设置过期时间(expires属性)为7天,同时设置cookie的path属性为”/admin” 
 

复制代码 代码示例:
$.cookie("exist", "exist", { path: '/admin', expires: 7 }); 
 

读取cookie: 
读取名称为exist的cookie值: 
 

复制代码 代码示例:
alert( $.cookie("exist") ); 
 

删除cookie: 
 

复制代码 代码示例:
$.cookie("example", null); 

例子: 
 

复制代码 代码示例:
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
    <title>jquery cookies操作_www.jb200.com</title> 
    <script src="../scripts/jquery-1.4.1.min.js"></script> 
    <script src="../scripts/jquery.cookie.js"></script> 
    <script type="text/javascript"> 
        $(document).ready(function () { 
            var i = 1; 
            //当点击按钮的时候隐藏《p》 
            $("#clk_submit").click(function () { 
                //判断是否存在cookies对象 
                if ($.cookie("exist") == null || $.cookie("exist") == "undefined") { 
                    //创建cookies对象并且给其赋值,设置了生命周期为7天 
                    $.cookie("exist", i, { expires: 7 }); 
                } 
                //获取cookies值 
                i = $.cookie("exist"); 
                
                //判断是否为0 
                if (i % 2 != 0) { 
                    $("p").hide(); 
                } 
                else { 
                    $("p").show(); 
                } 
                i++; 
                //保存到cookies里面 
                $.cookie("exist", i); 
            }) 
        }); 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
        <div> 
            <h2>this is a heading</h2> 
            <p>this is a paragraph.</p> 
            <p>this is another paragraph.</p> 
            <button type="button" id="clk_submit">click me</button> 
        </div> 
    </form> 
</body> 
</html> 
<pre name="code" class="java"></pre>