- ベストアンサー
jquery.cookie.jsの使い方について
- 入力フォームでのjquery.cookie.jsの使い方について分かりやすいソースサンプルや解説を求めています。
- 入力フォームでデータを保存するためにjquery.cookie.jsを使用したいですが、スクリプトの書き方が分かりません。
- jquery.cookie.jsを使った入力フォームのデータ保存方法について教えてください。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
#1です。 ＞どのように取得して、どのように呼び出したらいいか ＞アドバイスいただけませんでしょうか アドバイスできるような柄ではありませんが… ラジオボタンのチェックの状況はその要素のchecked属性で取得/設定が可能です。 単純に各要素の設定状況（true falese false…）みたいなのを記録しておくか、どうせ選択されるものは一つだけ（または0個）なので、その番号を記録しておくなどすれば再現が可能だと思われます。 ごく簡単な取得/設定の例を作成してみました。 取得は、選択されたものの順番と各設定状況を、設定は番号によってセットする例です。 簡単な入力チェックなども入っているので、実際にはもっと短くまとめられるはずです。 （全角空白は半角にしてください） <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>test</title> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> <!-- function get() { var elm = document.getElementById("form1").elements; var i=0, e, c=0, result = ""; while (e=elm[i++]) { if (e.type == "radio") { result += (result?", ":"") + e.checked; c++; if (e.checked) result = "No" + c + " : " + result; } } document.getElementById("text1").value = result; } function set() { var n = document.getElementById("text2").value; var elm = document.getElementById("form1").elements; var i, c=0; if (isNaN(n = parseInt(n))) { alert("数字を入力"); return; } for (i=0; i<elm.length; i++) { if (elm[i].type == "radio") { if ((++c) == n) elm[i].checked = true; } } } //--> </script> </head> <body> <form id="form1"> <input type="radio" name="test">ラジオ1 <input type="radio" name="test">ラジオ2 <input type="radio" name="test">ラジオ3 <form> <hr> <p> <input id="text1" type="text" value="" style="width:12em;"> <input type="button" value="選択ボタンを表示" onclick="get()"><br> <input id="text2" type="text" value=""> <input type="button" value="番号によりラジオボタンをセット" onclick="set()"> </p> </body> </html>
その他の回答 (2)
- yyr446
- ベストアンサー率65% (870/1330)
「jquery.cookie.js」の方じゃなく「jquery.ooCookie.js」 http://www.bsped.com/jquery.ooCookie.js の方を使って、簡単に作ってみました。 <form name="input"> 性別：<input type="radio" name="sex" value="男性" />男性／ <input type="radio" name="sex" value="女性" />女性<br /> 名前：<input type="text" name="name" /><br /> 住所：<input type="text" name="add" /><br /> <input type="button" value="記録" onClick="setck(this.form)" /><br /> <input type="button" value="呼び出し" onClick="getck(this.form)" /><br /> </form> に対して、 <script type="text/javascript"> function setck(f){ var c = new $.cookie(); c.data=$(f).serialize(); c.set(); } function getck(f){ var c = new $.cookie(); c.get(); var datas=decodeURIComponent(c.data).split("&"); for(var i=0;i<datas.length;i++){ var data=datas[i].split("="); for(var j=0;j<f.length;j++){ if(f[j].type=="radio" && f[j].name==data[0] && f[j].value==data[1]) f[j].checked=true; else if(f[j].type=="text" && f[j].name==data[0]) f[j].value=data[1]; } } } </script> ※行頭の全角空白文字は、半角空白に変えて下さい。
- fujillin
- ベストアンサー率61% (1594/2576)
確認してませんが… プラグインのサンプルコードをご覧になれば使用法はわかるかと http://plugins.jquery.com/project/Cookie http://stilbuero.de/jquery/cookie/ 要は $.cookie(key, data, { expires : day }); で書き込み $.cookie(key); で読み出しみたいな感じ ◇日本語での解説サイト http://mysketch.jp/blog/2008/10/javascriptjquerycookie.php ◇jQuery Cookieライブラリ] クッキーのデータを保存する/読み出す http://www.openspc2.org/reibun/javascript2/Library/jquery-cookie/0001/ http://www.openspc2.org/reibun/javascript2/Library/jquery-cookie/0002/
補足
ご回答ありがとうございます！！（御礼が遅くなりもうしわけありません） 教えていただいたサイトを参考に、がんばって試してみたところ、テキストボックスのデータのやりとりはうまくいくようになりました。うれしいです。 ただ、残念ながら、ラジオボタンの部分がうまくできません・・・。 よろしければ、どのように取得して、どのように呼び出したらいいかアドバイスいただけませんでしょうか・・・？ ぜひともよろしくお願いします。
お礼
ご親切にありがとうございます！ 早速試してみます。 大変勉強になります。