jQuery中cookie插件用法實(shí)例分析
本文實(shí)例講述了jQuery中cookie插件用法。分享給大家供大家參考,具體如下:
Jquery里面提供了很多插件,方便,安全,快速實(shí)用。這節(jié)一起熟悉下JQUERY中操作Cookie的插件,插件名稱為jquery.cookie.js,可以去官方網(wǎng)站下載。
下載地址: http://plugins.jquery.com/project/cookie.
插件主要報(bào)告如下幾個(gè)用法
1.創(chuàng)建Cookie
創(chuàng)建一個(gè)名稱為username,值為 admin的cookie ,如下
當(dāng)然cookie還包括路徑,過期時(shí)間等其他參數(shù),一起看下其他參數(shù)的用法
expires:表示過期時(shí)間,默認(rèn)為天,如上表示過期時(shí)間為7天,如果省略過期時(shí)間,表示關(guān)閉瀏覽器時(shí)候,cookie將被刪除
也可以設(shè)置cookie的過期時(shí)間,如下設(shè)置3分鐘后過期
var dt= new date();
dt.settime(date.gettime() + (3* 60 * 1000));
$.cookie('username', 'admin', { expires: dt});
path:定義cookie的有效路徑,默認(rèn)情況下路徑為創(chuàng)建cookie網(wǎng)頁所在的路徑,如果想讓整個(gè)網(wǎng)站訪問到,路徑設(shè)置為path: '/'
domain:設(shè)置cookie所在的域
secure: 如果為true表示cookie的傳輸需要使用https安全協(xié)議,默認(rèn)為false
2.刪除Cookie
可以使用兩種方法
$.removeCookie("username");
$.cookie('username',"null");
3.讀取cookie
如果沒有寫入cookie,讀取到的值為undefined
附:jquery.cookie.js完整代碼如下:
/*!
* jQuery Cookie Plugin v1.4.1
* https://github.com/carhartl/jquery-cookie
*
* Copyright 2006, 2014 Klaus Hartl
* Released under the MIT license
*/
(function (factory) {
if (typeof define === 'function' && define.amd) {
// AMD (Register as an anonymous module)
define(['jquery'], factory);
} else if (typeof exports === 'object') {
// Node/CommonJS
module.exports = factory(require('jquery'));
} else {
// Browser globals
factory(jQuery);
}
}(function ($) {
var pluses = /\+/g;
function encode(s) {
return config.raw ? s : encodeURIComponent(s);
}
function decode(s) {
return config.raw ? s : decodeURIComponent(s);
}
function stringifyCookieValue(value) {
return encode(config.json ? JSON.stringify(value) : String(value));
}
function parseCookieValue(s) {
if (s.indexOf('"') === 0) {
// This is a quoted cookie as according to RFC2068, unescape...
s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
}
try {
// Replace server-side written pluses with spaces.
// If we can't decode the cookie, ignore it, it's unusable.
// If we can't parse the cookie, ignore it, it's unusable.
s = decodeURIComponent(s.replace(pluses, ' '));
return config.json ? JSON.parse(s) : s;
} catch(e) {}
}
function read(s, converter) {
var value = config.raw ? s : parseCookieValue(s);
return $.isFunction(converter) ? converter(value) : value;
}
var config = $.cookie = function (key, value, options) {
// Write
if (arguments.length > 1 && !$.isFunction(value)) {
options = $.extend({}, config.defaults, options);
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setMilliseconds(t.getMilliseconds() + days * 864e+5);
}
return (document.cookie = [
encode(key), '=', stringifyCookieValue(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// Read
var result = key ? undefined : {},
// To prevent the for loop in the first place assign an empty array
// in case there are no cookies at all. Also prevents odd result when
// calling $.cookie().
cookies = document.cookie ? document.cookie.split('; ') : [],
i = 0,
l = cookies.length;
for (; i < l; i++) {
var parts = cookies[i].split('='),
name = decode(parts.shift()),
cookie = parts.join('=');
if (key === name) {
// If second argument (value) is a function it's a converter...
result = read(cookie, value);
break;
}
// Prevent storing a cookie that we couldn't decode.
if (!key && (cookie = read(cookie)) !== undefined) {
result[name] = cookie;
}
}
return result;
};
config.defaults = {};
$.removeCookie = function (key, options) {
// Must not alter options, thus extending a fresh object...
$.cookie(key, '', $.extend({}, options, { expires: -1 }));
return !$.cookie(key);
};
}));
希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。
相關(guān)文章
jquery實(shí)現(xiàn)的超出屏幕時(shí)把固定層變?yōu)槎ㄎ粚拥拇a
相信很多人都上過taobao吧,在taobao的產(chǎn)品列表頁有一個(gè)浮動(dòng)的用來排序的浮動(dòng)層,當(dāng)你拖動(dòng)滾動(dòng)條而導(dǎo)致那個(gè)排序欄看不到的時(shí)候它會(huì)自動(dòng)變?yōu)楦?dòng)層,一直固定在那里。2010-02-02
jquery+json實(shí)現(xiàn)數(shù)據(jù)二級(jí)聯(lián)動(dòng)的方法
這篇文章主要介紹了jquery+json實(shí)現(xiàn)數(shù)據(jù)二級(jí)聯(lián)動(dòng)的方法,涉及jQuery基于get方法與后臺(tái).net程序傳輸json交互實(shí)現(xiàn)二級(jí)聯(lián)動(dòng)菜單,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-11-11
使用jQuery制作浮動(dòng)工具欄的實(shí)例分享
這里所說的浮動(dòng)工具欄就是大家平時(shí)看到的社交網(wǎng)絡(luò)分享按鈕欄那樣的效果,可以做成浮動(dòng)效果且能上下移動(dòng),這里我們就來看一個(gè)使用jQuery制作頁面工具邊欄的實(shí)例分享.2016-05-05
jquery實(shí)現(xiàn)輸入框動(dòng)態(tài)增減的實(shí)例代碼
主要功能是動(dòng)態(tài)增減輸入框,而且支持對(duì)各個(gè)輸入框的檢測(cè),每個(gè)輸入框在輸入內(nèi)容后,對(duì)其進(jìn)行錯(cuò)誤提示2013-07-07
jQuery插件DataTables分頁開發(fā)心得體會(huì)
這篇文章主要為大家分享了jQuery插件DataTables分頁開發(fā)心得體會(huì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-08-08
移動(dòng)節(jié)點(diǎn)的jquery代碼
節(jié)點(diǎn)的移動(dòng)在應(yīng)用中比較常見,如何動(dòng)態(tài)移動(dòng)某一節(jié)點(diǎn)來實(shí)現(xiàn)某一特殊效果,下面有個(gè)不錯(cuò)的示例,希望對(duì)大家有所幫助2014-01-01
Jquery 獲取指定標(biāo)簽的對(duì)象及屬性的設(shè)置與移除
這篇文章主要介紹了Jquery如何獲取指定標(biāo)簽的對(duì)象及屬性的設(shè)置與移除,需要的朋友可以參考下2014-05-05
jQuery實(shí)現(xiàn)平滑滾動(dòng)頁面到指定錨點(diǎn)鏈接的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)平滑滾動(dòng)頁面到指定錨點(diǎn)鏈接的方法,涉及jquery鼠標(biāo)事件及頁面滾動(dòng)的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07

