什么是 cookie?
cookie 就是頁面用來保存信息,比如自動登錄、記住用戶名等等。
cookie 的特點
jquery.cookie.js 的用法進行詳細的介紹。
jquery.cookie.js 使用方法
Cookies
定義:讓網站服務器把少量數據儲存到客戶端的硬盤或內存,從客戶端的硬盤讀取數據的一種技術;
下載與引入:jquery.cookie.js基于jquery;先引入jquery,再引入:jquery.cookie.js;
下載:http://plugins.jquery.com/cookie/
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></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');
5.刪除cookie
$.cookie('the_cookie', null); //通過傳遞null作為cookie的值即可
6.可選參數
$.cookie('the_cookie','the_value',{  expires:7,   path:'/',  domain:'jquery.com',  secure:true}) expires:(Number|Date)有效期;設置一個整數時,單位是天;也可以設置一個日期對象作為Cookie的過期日期;
path:(String)創建該Cookie的頁面路徑;
domain:(String)創建該Cookie的頁面域名;
secure:(Booblean)如果設為true,那么此Cookie的傳輸會要求一個安全協議,例如:HTTPS;
使用方法:
設置 cookie:
$.cookie('the_cookie', 'the_value');注:如果 $.cookie 沒有第三個參數,那么當瀏覽器關閉時,該 cookie 將會自動刪除。
設置一個有效期為 7 天的 cookie:
$.cookie('the_cookie', 'the_value', {expires: 7});注:$.cookie 第三個參數是一個對象,除了可以設置有效期(expires: 7),還可以設置有效路徑(path: '/')、有效域(domain: 'jquery.com')及安全性(secure: true)。
讀取 cookie:
$.cookie('the_cookie');注:如果沒有該 cookie,返回 null。
刪除 cookie:
$.cookie('the_cookie', null);我們只需要給需要刪除的 cookie 設置為 null,就可以刪除該 cookie。
最后附上源代碼:
/** * Cookie plugin * * Copyright (c) 2006 Klaus Hartl (stilbuero.de) * Dual licensed under the MIT and GPL licenses: * http://www.opensource.org/licenses/mit-license.php * http://www.gnu.org/licenses/gpl.html * *//** * Create a cookie with the given name and value and other optional parameters. * * @example $.cookie('the_cookie', 'the_value'); * @desc Set the value of a cookie. * @example $.cookie('the_cookie', 'the_value', { expires: 7, path: '/', domain: 'jquery.com', secure: true }); * @desc Create a cookie with all available options. * @example $.cookie('the_cookie', 'the_value'); * @desc Create a session cookie. * @example $.cookie('the_cookie', null); * @desc Delete a cookie by passing null as value. Keep in mind that you have to use the same path and domain * used when the cookie was set. * * @param String name The name of the cookie. * @param String value The value of the cookie. * @param Object options An object literal containing key/value pairs to provide optional cookie attributes. * @option Number|Date expires Either an integer specifying the expiration date from now on in days or a Date object. *    If a negative value is specified (e.g. a date in the past), the cookie will be deleted. *    If set to null or omitted, the cookie will be a session cookie and will not be retained *    when the the browser exits. * @option String path The value of the path atribute of the cookie (default: path of page that created the cookie). * @option String domain The value of the domain attribute of the cookie (default: domain of page that created the cookie). * @option Boolean secure If true, the secure attribute of the cookie will be set and the cookie transmission will *   require a secure protocol (like HTTPS). * @type undefined * * @name $.cookie * @cat Plugins/Cookie * @author Klaus Hartl/klaus.hartl@stilbuero.de *//** * Get the value of a cookie with the given name. * * @example $.cookie('the_cookie'); * @desc Get the value of a cookie. * * @param String name The name of the cookie. * @return The value of the cookie. * @type String * * @name $.cookie * @cat Plugins/Cookie * @author Klaus Hartl/klaus.hartl@stilbuero.de */jQuery.cookie = function(name, value, options) { if (typeof value != 'undefined') { // name and value given, set cookie options = options || {}; if (value === null) {  value = '';  options = $.extend({}, options); // clone object since it's unexpected behavior if the expired property were changed  options.expires = -1; } var expires = ''; if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {  var date;  if (typeof options.expires == 'number') {  date = new Date();  date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));  } else {  date = options.expires;  }  expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE } // NOTE Needed to parenthesize options.path and options.domain // in the following expressions, otherwise they evaluate to undefined // in the packed version for some reason... var path = options.path ? '; path=' + (options.path) : ''; var domain = options.domain ? '; domain=' + (options.domain) : ''; var secure = options.secure ? '; secure' : ''; document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join(''); } else { // only name given, get cookie var cookieValue = null; if (document.cookie && document.cookie != '') {  var cookies = document.cookie.split(';');  for (var i = 0; i < cookies.length; i++) {  var cookie = jQuery.trim(cookies[i]);  // Does this cookie string begin with the name we want?  if (cookie.substring(0, name.length + 1) == (name + '=')) {   cookieValue = decodeURIComponent(cookie.substring(name.length + 1));   break;  }  } } return cookieValue; }};總結
以上就是這篇文章的全部內容了,希望本文的內容對大家的學習或者工作能帶來一定的幫助,如果有疑問大家可以留言交流。
新聞熱點
疑難解答