いつも参考にさせて頂いています。
いつも参考にさせて頂いています。
javascriptでセレクトメニューを作っているのですが
うまく出来ないのでどなたか教えて下さい。
宜しくおねがいします。
3連動するセレクトメニューで
3つ目のセレクトメニューを選ぶと
選ばれた項目に対応するURLに飛ぶように作っています。
ここからが質問なのですが、
ページに飛んだ時にセレクトメニューで選択した内容が消えてしまいます・・・
飛んだ先のページでも、選択した内容を表示させるには
どのようにすればいいのでしょうか?
ご存知の方がいましたら教えて下さい。
---html部分----
<html>
<head>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
<form id="f0">
<select id="s0">
<option value="">----------------</option>
</select>
<select id="s1">
<option value="">----------------</option>
</select>
<select id="s2">
<option value="">----------------</option>
</select>
</form>
</body>
</html>
---外部javascriptファイル----
var data=
{
吉野家:
{
"牛丼(並)":{0:"380円"},
"牛丼(大盛)":{1:"480円"},
"牛丼(特盛)":{2:"630円"}
}
,松屋:
{
"牛丼(並)":{3:"320円"},
"牛丼(大盛り)":{4:"420円"},
"牛丼(特盛)":{5:"520円"}
}
,すき家:
{
"牛丼(並)":{6:"280円"},
"牛丼(大盛)":{7:"380円"},
"牛丼(特盛)":{8:"480円"}
};
window.onload=function(){
s0=document.getElementById("s0");
s1=document.getElementById("s1");
s2=document.getElementById("s2");
setSelect(data,s0);
s0.onchange=function(){
clearSelect(s2);
if(this.value==""){
clearSelect(s1);
}else{
setSelect(data[this.value],s1);
}
}
s1.onchange=function(){
if(this.value==""){
clearSelect(s2);
}else{
setSelect(data[s0.value][this.value],s2);
}
}
s2.onchange=function(){
location.href="/////////";
}
}
function setSelect(obj,sel){
while(lc=sel.lastChild){
sel.removeChild(lc);
};
var op=document.createElement("option");
op.setAttribute("value","");
op.appendChild(document.createTextNode("----------------"));
sel.appendChild(op);
for(var i in obj){
var txt=(typeof obj[i]=="object")?i:obj[i];
var op=document.createElement("option");
op.setAttribute("value",i);
op.appendChild(document.createTextNode(txt));
sel.appendChild(op);
}
}
function clearSelect(sel){
while(lc=sel.lastChild){
sel.removeChild(lc);
};
var op=document.createElement("option");
op.appendChild(document.createTextNode("----------------"));
sel.appendChild(op);
};
お礼
おおお! 早くて明確な回答助かります、ありがとうございます。 まさに牛丼のようだと思ってしまいました。 ご飯の量は一緒なんですね。 ちょっと今週特盛食べてきます! 回答ありがとうございました。