jQuery常用插件——cookie插件

来源：互联网发布：9553软件下载编辑：程序博客网时间：2024/05/16 09:45

一个轻量级的cookie 插件，可以读取、写入、删除 cookie

使用cookie插件后，可以很方便地通过cookie对象保存、读取、删除用户的信息，还能通过cookie插件保存用户的浏览记录

1.语法

（1）调用格式：$.cookie(key，value，[option])

其中参数key为保存cookie对象的名称，value为名称对应的cookie值。

（2）保存：$.cookie(key，value)

（3）读取：$.cookie(key)

（4）删除：$.cookie(key，null)

（5）[option]参数说明：

1）expires

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

注：当指明了cookie有效时间时，所创建的cookie被称为“持久 cookie （persistent cookie）”。如果省略，那么创建的cookie是会话cookie，将在用户退出浏览器时被删除。

2）path　　

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

注：若想在整个网站中访问这个cookie需要这样设置有效路径：path: '/'；若想删除一个定义了有效路径的 cookie，你需要在调用函数时包含这个路径:

$.cookie('the_cookie', null, { path: '/'，domain: 'example.com' })

3）domain　　

cookie域名属性，默认与创建页域名一样。　　

注：这个地方要相当注意，跨域的概念，如果要主域名二级域名有效则要设置".xxx.com"

4） secrue:　　

一个布尔值，表示传输cookie值时，是否需要一个安全协议（HTTPS）。默认值为false，若为true，则需要HTTPS。

5）raw

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

要关闭这个功能设置 raw: true 即可。

2. jquery.cookie.js 的配置

首先包含jQuery的库文件，再在后面包含 jquery.cookie.js 的库文件。

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

3.实例

一个完整设置与读取cookie的页面代码：

<html xmlns="http://www.w3.org/1999/xhtml"><head>    <title>jQuery学习2</title>    <script src="jQuery.1.8.3.js" type="text/javascript"></script>    <script src="jquery.cookie.js" type="text/javascript"></script>    <script type="text/javascript">        $(function () {            $("#username").val($.cookie("username"));            if ($.cookie("like") == "刘德华") {                $(":radio[value='刘德华']").attr("checked", 'checked')            }            else {                $(":radio[value='张学友']").attr("checked", 'checked')            }            $(":button").click(function () {                $.cookie("username", $("#username").val(), {                    path: "/", expires: 7                })                $.cookie("like", $(":radio[checked]").val(), {                    path: "/", expiress: 7                })            })        })    </script></head><body>    <p><input type="text" id="username" value="" /></p>    <p>        <input type="radio" name="like" value="刘德华" />刘德华        <input type="radio" name="like" value="张学友" />张学友    </p>    <p><input type="button" value="保存" /></p></body></html>

cookie本质上是一个txt文本，因此只能够存入字符串，对象通常要序列化之后才能存入cookie，而取的时候要反序列才又能得到对象。

$(function () {            if ($.cookie("student") == null) {                var student = { name: "张三", age: 24 };                var str = JSON.stringify(student);　　//对序列化成字符串然后存入cookie                $.cookie("student", str, {                    expires:7   //设置时间，如果此处留空，则浏览器关闭此cookie就失效。                });                alert("cookie为空");            }            else {                var str1 = $.cookie("student");                var o1 = JSON.parse(str1);　　//字符反序列化成对象                alert(o1.name);　　　　　　　　//输反序列化出来的对象的姓名值            }        })

更多关于jQuery的cookie操作技巧请看http://www.jb51.net/Special/378.htm

0 0