jquery.cookie用法及其注意點
jquery.cookie是一個輕量級的cookie外掛,由於已被封裝好,可拿來即用。
基本的建立、讀取、刪除見另一篇文章 淺談localStorage、sessionStorage 與cookie 。
從名字上就可以看出jquery.cookie是依賴於jquery的,所以在使用jquery.cookie的時候,應該先引入jquery檔案,再引入jquery.cookie檔案。
建立cookie: $.cookie('name', '張三')
訪問cookie: $.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 就可以獲取成功。ps:和window.localstroage一樣,只能存字串.
再來說說注意事項:
(1)、在使用jquery.cookie的時候是需要在伺服器下使用(可以使用tomcat、appserve或者sublime Text等),如果只是在本地的一個靜態檔案中使用jquery.cookie,然後直接通過瀏覽器開啟,會發現結果是undefined,這個問題搞得我一度懷疑人生。
(2)、當沒有指明cookie有效時間時,所建立的cookie有效期預設到使用者關閉瀏覽器為止,因此也被稱為會話cookie