ラジオボタンによって背景色、画像を変え、それを前回と同じに

[新着] Webテンプレートを仮オープンしました



0   名前: チョロブー : 2007/10/23(火) 20:11  [URL]  ID:c97aMw1n sub-t1
【何をしたいのか】

画面下方のラジオボタンで背景色とテーブル4隅の画像を変更し、
それをいつ開いても同じ色になるようにしたい。

【現在の状況】

下のほうにあるラジオボタンで背景色と、テーブルの4隅の画像を変えることには成功したのですが、
いつ開いても前回と同じ色にできるようにはならないかとわからないながらクッキーに手をつけました。
すると、更新するだけならうまく前回と同じ色になるのですが、
新しいウィンドウで開くと前回と同じラジオボタンにチェックは入るのですが色が変わりません。

【サンプルの提示】

javaスクリプト部---

<script>
function save(e){
var d=new Date()
d.setTime(d.getTime()+1000*60*60*24*7) //1週間
var exp=' ; expires='+d.toGMTString()
for(var i=0;i<e.length;i++){
if(e[i].type=="radio"){
document.cookie=e[i].name+"="+e[i].type+":"+getchecked(e[e[i].name])+exp
}
}
}

function getchecked(r){
if(!r.length){return r.checked}
var n=-1
for(var i=0;i<r.length;i++){
if(r[i].checked){n=i;break}
}
return n
}

function getselected(sel){
var n=""
for(var i=0;i<sel.options.length;i++){
if(sel.options[i].selected){n+=i+"|"}
}
return n
}

function load(e){
var ck=document.cookie.split("; ")
if(ck.length<=1){return}
var ar,nm,a,t,v,tmp
for(var i=0;i<ck.length;i++){
ar=ck[i].split("=");nm=ar[0];tmp=ar[1].split(":");if(tmp.length>1){t=tmp[0];v=tmp[1]}
if(e[nm]&&(e[nm].type==t||(e[nm].length>1&&e[nm][0].type==t))){
if(e[nm].type=="text"||e[nm].type=="textarea"||e[nm].type=="password"){
e[nm].value=unescape(v)
}
if(e[nm].length>1&&e[nm][0].type=="radio"){
if(v!=-1){e[nm][v].onclick}
}
if(e[nm].type=="select-multiple"){
tmp=v.split("|")
for(var n=0;n<tmp.length-1;n++){e[nm].options[tmp[n]].selected=true}
}
}
}
}
</script>
<SCRIPT LANGUAGE="JavaScript">
<!--
function Gazou(mysrc1,mysrc2,mysrc3,mysrc4,mysrc5,mysrc6,mysrc7,mysrc8,bgcolor){
document.myIMG1.src=mysrc1;
document.myIMG2.src=mysrc2;
document.myIMG3.src=mysrc3;
document.myIMG4.src=mysrc4;
document.myIMG5.src=mysrc5;
document.myIMG6.src=mysrc6;
document.myIMG7.src=mysrc7;
document.myIMG8.src=mysrc8;
document.bgColor=bgcolor;
}
//-->
</SCRIPT>
<BODY bgColor=#3333ff onload=load(document.forms[0].elements)>

4隅の画像---

<img name="myIMG1" border="0" width="20" height="20">

ラジオボタン部---

<form onclick="save(this.elements);return false">
<INPUT onclick="Gazou('W1C3333FF.gif','W2C3333FF.gif','W3C3333FF.gif','W4C3333FF.gif','W1C3333FF.gif','W2C3333FF.gif','W3C3333FF.gif','W4C3333FF.gif','#3333FF')" type=radio name=r1 value=blue>青
<INPUT onclick="Gazou('W1C009900.gif','W2C009900.gif','W3C009900.gif','W4C009900.gif','W1C009900.gif','W2C009900.gif','W3C009900.gif','W4C009900.gif','#009900')" type=radio name=r1 value=gleen>緑
<INPUT onclick="Gazou('W1CCC0000.gif','W2CCC0000.gif','W3CCC0000.gif','W4CCC0000.gif','W1CCC0000.gif','W2CCC0000.gif','W3CCC0000.gif','W4CCC0000.gif','#CC0000')" type=radio name=r1 value=red>赤
</form></DIV>


【何をしてみたのか】

java,cookieにあまり詳しくないのでいろいろとコピペして作りましたので
おかしなところが多々あると思います。
ラジオボタンの onclickをonfocusにしてみたりもしました。
たぶんonclickやonfocusではクッキーで保存してもチェックがあるだけでは意味がないので表示されないのかと思い、
ほかの on〜 は無いかといろいろ探してみたのですがだめでした。
クッキーをいじれば何とかなるのかもしれないのですが僕の知識ではちんぷんかんぷんなので無理でした。

【検索用語】
ラジオボタン/ラジオボタン 選択されているとき/onclick/onfocus
function/function load/function get/ラジオボタン 画像を変更 等。
履歴が残っているものだけ書き出してみました。

1   名前: 元帥 : 2007/10/23(火) 20:11  [URL]  ID:tUWYjbn3 sub-bK
> 新しいウィンドウで開くと前回と同じラジオボタンにチェックは入るのですが色が変わりません。

ソースコードを投稿する際には、問題の発生を確認可能な最低限のソースコードを載せて下さい。
詳細はURLを参照しろ、では過去ログとして役に立ちません。

load関数では、クッキーの値からフォームの値をいじっているだけのようです。
この部分に色を変更するスクリプトを挿入すると良いでしょう。

ご自身が実現したい成果物にたどり着くのに遠回りになるかもしれませんが、先ずは基本を学ぶ事をお勧めします。
各スクリプトの意味を理解してこそ、その部分を変更すべきなのかが分かる筈です。
取り敢えず、HTML文法チェック:
http://openlab.ring.gr.jp/k16/htmllint/htmllint.html

2   名前: チョロブー : 2007/10/23(火) 20:11  [URL]  ID:c97aMw1n sub-t1
返信ありがとうございます。

わかりました。基本を勉強してみます。
どうもお騒がせしました。 m( _ _ )m

一覧へ戻る