1. 程式人生 > >jquery.cookie用法及其註意點

jquery.cookie用法及其註意點

靜態 對象 ring 讀取 有效期 href 下使用 靜態文件 parse

  jquery.cookie是一個輕量級的cookie插件,由於已被封裝好,可拿來即用。

  基本的創建、讀取、刪除見另一篇文章 淺談localStorage、sessionStorage 與cookie 。

  從名字上就可以看出jquery.cookie是依賴於jquery的,所以在使用jquery.cookie的時候,應該先引入jquery文件,再引入jquery.cookie文件。

  創建cookie: $.cookie(‘name‘, ‘張三‘)

  然後訪問的時候使用$.cookie(‘name‘)就行。

  但是,如果想要一次性存入多個數據呢?假如想將一個對象{‘name’: ‘張三‘, ‘age‘: ‘45‘, ‘sex‘: ‘男‘}存入名為person的cookie中,該如何操作呢?

  像這樣行嗎? $.cookie(‘person‘, {‘name’: ‘張三‘, ‘age‘: ‘45‘, ‘sex‘: ‘男‘}) 。雖然這樣能創建成功,通過 $.cookie(person) 也能夠獲取到結果:

[object Object]。然而當使用 $.cookie(‘person‘).name 來獲取時,結果卻是undefined。可見,這樣是不可行的。

  原因在於,cookie本質上是一個txt文本,因此只能夠存入字符串,對象通常要序列化之後才能存入cookie,而取的時候要反序列才又能得到對象

  因此,在存入的時候可以這樣寫, $.cookie(‘person‘, JSON.stringify({‘name’: ‘張三‘, ‘age‘: ‘45‘, ‘sex‘: ‘男‘}))

,然後獲取的時候再將其反序列化,通過

JSON.parse($.cookie(‘person‘)).name 就可以獲取成功。

  很坑爹有木有。

  再來說說註意事項

  (1)、在使用jquery.cookie的時候是需要在服務器下使用(可以使用tomcat、appserve或者sublime Text等),如果只是在本地的一個靜態文件中使用jquery.cookie,然後直接通過瀏覽器打開,會發現結果是undefined,這個問題搞得我一度懷疑人生。

  (2)、當沒有指明cookie有效時間時,所創建的cookie有效期默認到用戶關閉瀏覽器為止,因此也被稱為會話cookie

jquery.cookie用法及其註意點