こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

avaSprictを使ってcookieに保存できるようにしたい

JavaSprictで動かす計算式を作りました。
見よう見まねで初めて作ったので色々と変なところがあるかもしれませんが
とりあえず動作はOKな状態になっています。
HTMLソースと、jsファイルの中身は下記のようになっているのですが
このファイルのINPUT1とINPUT2、プルダウン1とプルダウン2の内容を
JavaSprictを使ってcookieに保存できるようにしたいです。
jsファイルをどのようにすれば良いでしょうか?
できれば、Saveボタンのようなものが無い状態で
cookieを削除するまでずっと保存できる形にしたいです。

【HTMLソース】
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML lang="ja">
<HEAD>
<SCRIPT type="text/JavaScript" src="test.js">
</SCRIPT>
<META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 10.0.0.0 for Windows">
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Style-Type" content="text/css">
<TITLE>
test
</TITLE>
</HEAD>
<BODY onload="SetTarget()">
<P>
test
</P>
<TABLE>
<TBODY>
<TR>
<TD>
INPUT1
</TD>
<TD>
<INPUT type="text" value="200" size="11" onkeyup="NumOnly(this);Calc()">
</TD>
</TR>
<TR>
<TD>
INPUT2
</TD>
<TD>
<INPUT type="text" value="500" size="11" onkeyup="NumOnly(this);Calc()">
</TD>
</TR>
</TBODY>
</TABLE>
<TABLE border="1">
<TBODY>
<TR>
<TD><SELECT onchange="Calc()">
<OPTION value=",">プルダウン1
</OPTION>
<OPTION value="1.4">P1-1
</OPTION>
<OPTION value="1.5">P1-2
</OPTION>
</SELECT></TD>
<TD><SELECT onchange="Calc()">
<OPTION value=",">プルダウン2
</OPTION>
<OPTION value="1.2">P2-1
</OPTION>
<OPTION value="1.3">P2-2
</OPTION>
</SELECT></TD>
</TR>
</TBODY>
</TABLE>
<HR>
<SELECT onchange="ListSel(this.value)">
<OPTION value=",,">
リスト
</OPTION>
<option value="100,30,100">
リスト2
</option>
<option value="1220,60,80">
リスト3
</option>
</SELECT>
<TABLE border="0" cellpadding="3" cellspacing="1">
<TBODY>
<TR>
<TD bgcolor="#FFFFFF">
1
<INPUT type="text" size="11" value="" onkeyup="NumOnly(this);Calc()">
</TD>
<TD bgcolor="#FFFFFF">
2
<INPUT type="text" size="11" value="" onkeyup="NumOnly(this);Calc()">
</TD>
<TD bgcolor="#FFFFFF">
3
<INPUT type="text" size="11" value="" onkeyup="NumOnly(this);Calc()">
</TD>
</TR>
</TBODY>
</TABLE>
<HR>
<B>
Ans
</B>
<TABLE border="1">
<TBODY>
<TR>
<TD>Ans1</TD>
<TD>Ans2</TD>
<TD>Ans3</TD>
</TR>
<TR>
<TD><INPUT type="text" size="11"></TD>
<TD><INPUT type="text" size="11"></TD>
<TD><INPUT type="text" size="11"></TD>
</TR>
</TBODY>
</TABLE>
</BODY>
</HTML>

投稿日時 - 2008-10-15 10:30:30

QNo.4402975

暇なときに回答ください

質問者が選んだベストアンサー

クッキーの読み出しと保存する関数のサンプルを示しただけで
それを付け加えただけでは、クッキーの読み出し保存は行われません。

<input type="text" id="a" onChange="saveCookie('a',this.value,10)">
で保存期間10日で書き出し。

window.onload = function(){
document.getElementById('a').value=loadCookie('a');
}

投稿日時 - 2008-10-16 16:40:30

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(4)

ANo.3

function saveCookie( vn, v, dy ){ if(navigator.cookieEnabled) document.cookie=vn+'='+escape(v)+ ';expires='+new Date((new Date()).getTime()+dy*86400000).toGMTString();}
function loadCookie(vn){ var r = '',o = document.cookie.split('; '); for (var i in o){ var c = o[i].split('='); if (c[0]==vn && c[1]!=''){ r = c[1]?unescape(c[1]):'';break; }} return r;}

投稿日時 - 2008-10-15 16:26:48

補足

ご回答ありがとうございます。

test.jsの最後に、貼り付けて試してみたのですが
IE6の環境ではcookieに保存されることはありませんでした。
(INPUT値変更、プルダウンリストを変更後、IE6を一端閉じ、再度htmlを開きましたが初期値に戻っていました)

変更して貼り付けなければならない箇所があるのでしょうか?
再度質問で申し訳ございませんが、引き続きアドバイスお願いいたします。

投稿日時 - 2008-10-16 10:32:30

ANo.2

>Saveボタンのようなものが無い状態で
計算をしたときに、同時にクッキーに記録しておくとか、タイミングさえ見計らえばボタンを押さなくてもできます。

質問者さんの技量なら、構文さえわかれば、あとは必要に応じてアレンジできそうですから、以下を参考になされば、実装は比較的簡単かと
 http://www.tohoho-web.com/wwwcook.htm

投稿日時 - 2008-10-15 12:27:09

お礼

ご紹介ありがとうございます。
見よう見まねで作ったもので、知識が全くといって良いほど無いので
理解できるか不安ですが、参考にさせていただきます。

投稿日時 - 2008-10-16 10:30:05

ANo.1

肝心のJavaSprictの部分が抜けていますよ

投稿日時 - 2008-10-15 10:40:26

補足

jsファイルの中身が、文字数制限の関係で記載できませんでした・・すみません。
タイトルも頭にJが抜けています、重ね重ね申し訳ございません。
こちらに記載させていただきます

【test.jsの中身】
var _in1, _in2, _p1, _p2, _list1, _list2, _list3, _ans1, _ans2, _ans3;

function SetTarget(){
var Ipt, Slc;
Ipt=document.getElementsByTagName('input');
Slc=document.getElementsByTagName('select');
_in1=Ipt[0]; _in2=Ipt[1];
_p1=Slc[0]; _p2=Slc[1];
_list1=Ipt[2]; _list2=Ipt[3]; _list3=Ipt[4];
_ans1=Ipt[5]; _ans2=Ipt[6]; _ans3=Ipt[7];
}

function Calc(){
var in1,in2,p1,p2,list1,list2,list3;
in1=_in1.value-0;
in2=_in2.value-0;
p1=_p1.value-0;
p2=_p2.value-0;
list1=_list1.value-0;
list2=_list2.value-0;
list3=_list3.value-0;

//計算
all=(in1>0&&in2>0)?Math.floor((in1-48)*20+in2):'';
ans1=(all>0)?Math.floor((all-list2)*(list3*0.01)):'';
_ans1.value=ans1;
ans2=(all>0&&p1>0&&list2>0&&list3>0)?Math.floor((all*p1-list2)*(list3*0.01)):'';
_ans2.value=ans2;
ans3=(all>0&&p2>0&&list2>0&&list3>0)?Math.floor((all*p2-list2)*(list3*0.01)):'';
_ans3.value=ans3;
}

/*
alert();
*/

function ListSel(x){
var P=x.split(',');
_list1.value =P[0];
_list2.value=P[1];
_list3.value=P[2];
Calc();
}

function NumOnly(x){
var u=x.value;
x.value=u.replace(/[^0-9]/,'');
}

投稿日時 - 2008-10-15 10:42:16

あなたにオススメの質問