小さい頃はエラ呼吸

いつのまにやら肺で呼吸をしています。


JavaScript(jQuery)でcookieのデータを操作する方法

jQuery JavaScript

はじめに

このエントリではJavaScriptでcookieのデータを読み書きする方法について書いています。jQueryを使わずにJavaScriptだけでcookieを操作することはできますが、jQueryを使うととても簡単に実装することができます。
このエントリを書くにあたり、以下のサイトを参考にしました。

jQuery逆引きマニュアル Webデザインの現場で役立つ基本と実践
jQuery逆引きマニュアル Webデザインの現場で役立つ基本と実践
posted with amazlet at 11.05.14
西畑一馬 中村享介 徳田和規
インプレスジャパン
売り上げランキング: 18792
Amazon.co.jp で詳細を見る

JavaScriptによるcookieの操作

JavaScriptだけでcookieを操作する場合、以下のようにします。

// cookieにデータをセット
document.cookie = "KEY=VALUE";
// cookieからデータを取得
var hoge = document.cookie;

document.cookieの値を取得すると分かりますが、cookieに格納した文字列がすべて取得されてしまいます。特定のキーに対応した値を取得する標準関数がないので、以下のサイトのようにキーから値を取り出すような実装をする必要があります。

cookieを簡単に扱えるようにしたjquery.cookie.js

キーから値を取得するちょっと面倒な処理をとても簡単にできるようにしてくれるのがjQueryのプラグインjquery.cookie.jsです。

jquery.cookie.jsの使い方

はじめに、jQueryとjquery.cookie.jsを読み込ませます。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script>

jquery.cookie.jsでcookieを操作するには、以下のようにします。

// cookieにデータをセット
$.cookie('KEY', 'VALUE');
// KEYに対応する値を取得
var hoge = $.cookie('KEY');

expiresでcookieの有効期間を指定することができます。以下のコードの場合は7日間有効になります。

$.cookie('KEY', 'VALUE', { expires: 7 });

関連エントリ