CookieManager.jsが感動的に楽な件について
JSでcookieの読み書きをする機会に出会った。
ネイティブのcookieの読み書きのコードを追うと、自分でexpireなどの文字列を結合してから設定するもよう。お手軽からはとても遠い。
var tmp = keyname + "=" + escape(value) + "; " + "expires=Fri, 31-Dec-2010 23:59:59; "; document.cookie = tmp;
なんとも不毛に感じた。
早速googleさまで検索する「javascript+cookie+ライブラリ」。
http://phpspot.org/blog/archives/2006/11/javascriptcooki.html
javaScriptでクッキーを超簡単に使うライブラリ「Cookie Manager」。
JavaScriptでクッキーを扱うのって、いちいちクッキーをパースして面倒だ、と思っていた人は多いのではないでしょうか?
CookieManager.jsを使えば、phpでcookieを使うときみたいに簡単にcookieが使えます。
prototype.jsをベースとしていて、サンプルのコードは次のような感じになります。
サンプルはクッキーを使ったアクセスカウンタクラスです。
すばらしいですね。本家のリンクはこちら
以下は見よう見まねで書いたJS。リスティングサイトの資料請求ボタンで「後で請求」とか言う画像を押下するとcookieに対象のIDが書き込まれるという結構ありがちな機能を実装したつもり。
JSは勝手が分からなくていろいろ苦労しました。
- smartyでの出しわけなんてやめたかった。
- setItemとdeleteItemに関数を分けたかった(一度画像を押下した後onmousedownに日も付くファンクションの動的な切り替え方法が分からなかった。)
{if $itemList[item].cookie} <img src="/images/delete_inq.jpg" onmousedown="setItem('{$itemList[item].id}')" name='item_cookie_{$itemList[item].id} '> {else} <img src="/images/reg_inq.jpg" onmousedown="setItem('{$itemList[item].id}')" name='item_cookie_{$itemList[item].id} '> {/if}
function setItem( id ){ var image = "ok"; var manager = new CookieManager(); var item_list_string = manager.getCookie("ITEM_LIST"); var item_list = []; if ( item_list_string ) { item_list = item_list_string.split(","); } if ( item_list.indexOf( id ) != -1 ) { item_list = item_list.without( id ); } else { item_list.push( id ); image = "ng"; } var result = item_list.uniq(); manager.setCookie("ITEM_LIST", result.join(",")); var tags = "item_cookie_" + id; document.images[tags].src = "/images/" + image + ".jpg"; }