OKWAVEのAI「あい」が美容・健康の悩みに最適な回答をご提案!
-PR-
解決
済み

同一ページに複数のプルダウンメニュー

  • 困ってます
  • 質問No.157334
  • 閲覧数169
  • ありがとう数1
  • 気になる数0
  • 回答数1
  • コメント数0

お礼率 86% (353/409)

同一ページに複数のプルダウンメニューをつけたいのですが、
どうすればよいのでしょうか。

下記のように1つはつけることができたのですが、
2つめから、どこをどう変えて追加すればよいのかわかりません。


<script language="javascript">
<!--
function A_Li(){
Sel=document.Link1.OP.selectedIndex;
Ms=document.Link1.OP.options[Sel].value;
parent.main.location.href=Ms;}
// -->
</script>


<FORM name="Link1">
<SELECT name="OP" onChange="A_Li()" size="1">
<OPTION Value="main.htm" SELECTED>ページを選んでください
<option value="main.htm">ぺージ1</option>
<OPTION Value="abc.htm">ページ2
<OPTION Value="def.htm">ページ3
</SELECT>

よろしくお願いします。
通報する
  • 回答数1
  • 気になる
    質問をブックマークします。
    マイページでまとめて確認できます。

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

  • 回答No.1
レベル12

ベストアンサー率 75% (398/526)

最低限、違わなければならないのは、SELECT の name 値です。
また、質問のように FORM 名や SELECT 名を直接参照している場合、A_Li() という関数と同じような関数が、もう1つ必要になります。
こんな感じになるでしょうか。

<script language="javascript">
<!--
function A_Li() {
  Sel=document.Link1.OP.selectedIndex;
  Ms=document.Link1.OP.options[Sel].value;
  parent.main.location.href=Ms;}
function B_Li() {
  Sel=document.Link1.OP2.selectedIndex;
  Ms=document.Link1.OP2.options[Sel].value;
  parent.main.location.href=Ms;}
// -->
</script>


<FORM name="Link1">
<SELECT name="OP" onChange="A_Li()" size="1">
<OPTION Value="main.htm" SELECTED>ページを選んでください
<option value="main.htm">ぺージ1</option>
<OPTION Value="abc.htm">ページ2
<OPTION Value="def.htm">ページ3
</SELECT>

<SELECT name="OP2" onChange="B_Li()" size="1">
<OPTION Value="aaa.htm" SELECTED>ページを選んでください
<option value="bbb.htm">ぺージ1</option>
<OPTION Value="ccc.htm">ページ2
<OPTION Value="ddd.htm">ページ3
</SELECT>

もちろん OP2が、OP とは異なる FORM になる場合、B_Li() 内の Link1 という部分も変えなければなりません。

でも、ただページを飛ばすだけの関数を2つも用意するのもなんなので、次のように SELECT オブジェクト自身(this)を関数に渡すようにすれば、関数は1つで済みます。

<script language="javascript">
<!--
function A_Li(obj) {
  Sel=obj.selectedIndex;
  Ms=obj.options[Sel].value;
  parent.main.location.href=Ms;}
// -->
</script>


<FORM name="Link1">
<SELECT name="OP" onChange="A_Li(this)" size="1">
<OPTION Value="main.htm" SELECTED>ページを選んでください
<option value="main.htm">ぺージ1</option>
<OPTION Value="abc.htm">ページ2
<OPTION Value="def.htm">ページ3
</SELECT>

<SELECT name="OP2" onChange="A_Li(this)" size="1">
<OPTION Value="aaa.htm" SELECTED>ページを選んでください
<option value="bbb.htm">ぺージ1</option>
<OPTION Value="ccc.htm">ページ2
<OPTION Value="ddd.htm">ページ3
</SELECT>

thisについては、JavaScriptの本などで調べてみて下さい。
お礼コメント
shizuku

お礼率 86% (353/409)

なるほど、とてもよくわかりました。
きちんと動作しておかげさまで、作業できます。

助かりました。
ありがとうございました!
投稿日時 - 2001-10-26 08:53:50
-PR-
-PR-
このQ&Aで解決しましたか?
関連するQ&A
-PR-
-PR-
こんな書き方もあるよ!この情報は知ってる?あなたの知識を教えて!
このQ&Aにはまだコメントがありません。
あなたの思ったこと、知っていることをここにコメントしてみましょう。

その他の関連するQ&A、テーマをキーワードで探す

キーワードでQ&A、テーマを検索する
-PR-
-PR-
-PR-

特集


いま みんなが気になるQ&A

関連するQ&A

-PR-

ピックアップ

-PR-
ページ先頭へ