プルダウンメニューで、選択項目をリンク先でも維持したい。

解決済

質問者：shiho78122
質問日時：2006/01/19 16:54
回答数：3件

javascriptを使用したプルダウンメニューについて質問です。

<form name="form1">
<select name="select" onChange="location=select.options[select.selectedIndex].value">
<option value="a.html#01">Ａ01</option>
<option value="a.html#02">Ａ02</option>
<option value="a.html#03">Ａ03</option>
<option>---------------</option>
<option value="b.html#01">Ｂ01</option>
<option value="b.html#02">Ｂ02</option>
<option>---------------</option>
</select>
</form>

２つのページ（a.html、b.html）上部に上記のようなプルダウンメニューを置き、それぞれ相互に行き来できるようにしました。
一応正常に動くのですが、たとえばa.htmlのプルダウンで『Ｂ01』を選択してリンク先b.htmlに飛ぶと、プルダウンの選択項目が一番上の『Ａ01』に戻ってしまっています。
b.htmlに飛んだ後も『Ｂ01』選択の状態で残したいのですが。
どのようにすればよいのでしょうか・・・

よろしくお願い致します。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.3ベストアンサー

回答者： arenani_sorenani
回答日時：2006/01/20 11:32

あまり綺麗には書けてませんが、取りあえずは動くとおもいます・・

<html>
<head>
<script>
function start(){
x=location.hash;
if(x!=""){
y=form1.select1.options;
for(i=0;i<y.length;i++){
z=y[i].value.indexOf(x,0)
if(z!=-1){
form1.select1.options[i].selected=true;
}
}
}
}
</script>
</head>
<body onload="start()">
<form name="form1">
<select name="select1" onchange="location.href=this.options[this.selectedIndex].value">
<option value="a.html#A01">Ａ01</option>
<option value="a.html#A02">Ａ02</option>
<option value="a.html#A03">Ａ03</option>
<option value="b.html#B01">Ｂ01</option>
<option value="b.html#B02">Ｂ02</option>
<option value="b.html#B03">Ｂ03</option>
</select>
</form>

<p id="A01">Ａ01</p>
<p id="A02">Ａ02</p>
<p id="A03">Ａ03</p>
</body>
</html>

- 0
- 件

通報する

この回答へのお礼

早速試してみたところ、動きました！すごいです！
No.1、No.2お二方の回答を参考に色々がんばってはみたのですが
全く出来ず困り果てていました。
本当にありがとうございます。
これからじっくり解析していきたいと思います。

通報する

お礼日時：2006/01/20 14:38

No.2

回答者： gimmick
回答日時：2006/01/19 21:42

考え方だけ書きます。

まず、指定されたアンカーはwindow.location.hashで取得できます。
例えば、b.html#01に飛んだ場合、b.html側では"#01"という文字列が取得できます。
そこで、bodyか何かのonLoadイベントで指定されたアンカーをチェックして、
その内容に応じてselectのvalueかselectedIndexを指定します。

試してないので自信は無いのですが、多分この方法でできると思います。