リストボックスの連動サンプルをカスタマイズする方法

2002/09/07 14:57

このQ&Aのポイント

リストボックスを連動させるJavaScriptのサンプルコードを改造して、リストボックスの個数を自由に対応させる方法を質問します。
リストボックスの選択値を取得し、URLのクエリパラメータとして使用するJavaScriptのサンプルコードを紹介します。
リストボックスの選択値を連動させるために、script部分にnameなどを記述せずに改造する方法を質問します。

s-holmes
お礼率47% (767/1609)

JavaScript
回答数5
ありがとう数1

みんなの回答 （5）
専門家の回答

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

ベストアンサー

ittochan
ベストアンサー率64% (2667/4137)

2002/09/08 10:44 回答No.5

＞４はchangeしないできますぅ。＿ρ゛ (・_；O) <HTML> <HEAD> <PUBLIC:ATTACH EVENT="ondetach" ONEVENT="cleanup()" /> <TITLE></TITLE> <SCRIPT language=JavaScript>  </SCRIPT> </HEAD> <BODY LANGUAGE=javascript onload="return window_onload()"> <P></P> <P><BR> <FORM> <SELECT name="サイズ"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="big">big</OPTION> <OPTION VALUE="small">small</OPTION> </SELECT> <SELECT name="色"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="red">red</OPTION> <OPTION VALUE="white">white</OPTION> </SELECT> <SELECT name="構造"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="red">red</OPTION> <OPTION VALUE="white">white</OPTION> </SELECT> </FORM> <BR> <INPUT SIZE=50 id="txt" > </P> <SELECT name="秘密"> <OPTION VALUE="" SELECTED>↓【選択しないで】</OPTION> <OPTION VALUE="red">XXX</OPTION> <OPTION VALUE="white">YYY</OPTION> </SELECT> </BODY> </HTML>

質問者

お礼 2002/09/08 11:05

ど～も(^O^) お疲れ？です。やってもらうと簡単なのに、自分ではどんだけ時間かけてもできない悲しさです。住所と名前わかったらビール券でも送りたい気分です。気持ちだけ受取って下さい、 (^^; ＃ほとんどコピー＆ペーストでしかjavascriptを使えない自分に付き合っていただきましてありがとうございました。

その他の回答 (4)

ittochan
ベストアンサー率64% (2667/4137)

2002/09/08 08:30 回答No.4

＞とselect nameをhtml部分にそのまま書いたのを＞取得する形にできないでしょうか。できますよ。岩））-T)グスグス <HTML> <HEAD> <PUBLIC:ATTACH EVENT="ondetach" ONEVENT="cleanup()" /> <TITLE></TITLE> <SCRIPT language=JavaScript>  </SCRIPT> </HEAD> <BODY LANGUAGE=javascript onload="return window_onload()"> <P></P> <P><BR> <SELECT name="サイズ"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="big">big</OPTION> <OPTION VALUE="small">small</OPTION> </SELECT> <SELECT name="色"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="red">red</OPTION> <OPTION VALUE="white">white</OPTION> </SELECT> <SELECT name="構造"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="red">red</OPTION> <OPTION VALUE="white">white</OPTION> </SELECT> <BR> <INPUT SIZE=50 id="txt" > </P> </BODY> </HTML>

質問者

補足 2002/09/08 10:04

回答ありがとうございました。お付き合いいただいて恐縮です。 (^^; サンプルの動作は完璧です。(^O^) 清水寺から飛び降りたつもりで、もう１個・・・。実は、このjavascriptを既存の多数のページに組み込んで使おうと思っていたので、早速テストしてみたのですが、このスクリプトだと、既存のリストボックス選択の時にもchangeしてしまいます。既存のHTML部分（リストボックス含む）に影響を与えずに、新設した部分のみchangeするようにしたいのですが。 (例）１<SELECT name="サイズ"> ・・・・２<SELECT name="色"> ・・・・３<SELECT name="構造"> ・・・・４<SELECT name="上記と無関係"> ・・・・１～３はchange ４はchangeしない４のようなリストボックスがページには多数あり、それをいじらないで回答のスクリプト部分を組み込んで使いたい。 (^^; 他力本願ですみません。自分でも試行錯誤はしているのですがとても及びません。あとは自分でやれというおしかりでも・・・ (^^;

ittochan
ベストアンサー率64% (2667/4137)

2002/09/07 21:44 回答No.3

おっと、 function event_onchange(){ var strS = new Array(); var sel=document.getElementsByTagName("SELECT"); ここの var sel・・・・・の一行は削除してね。

ittochan
ベストアンサー率64% (2667/4137)

2002/09/07 21:42 回答No.2

＞厚かましくも希望を追加すると (^^; えーーん壁┃oT) ウルルルーじゃあこれは？ <HTML> <HEAD> <PUBLIC:ATTACH EVENT="ondetach" ONEVENT="cleanup()" /> <TITLE></TITLE> <SCRIPT language=JavaScript>  </SCRIPT> </HEAD> <BODY LANGUAGE=javascript onload="return window_onload()"> <SELECT> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="big">big</OPTION> <OPTION VALUE="small">small</OPTION> </SELECT> <SELECT> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="red">red</OPTION> <OPTION VALUE="white">white</OPTION> </SELECT> <BR> <INPUT SIZE=50 id="txt" > </BODY> </HTML>

質問者

補足 2002/09/08 02:20

恥を忍んでさらにお願い・・。 <SELECT name="サイズ"> ・・・・・ <SELECT name="色"> ・・・・・ <SELECT name="構造"> ・・・・・とselect nameをhtml部分にそのまま書いたのを取得する形にできないでしょうか。 javascript部分をうまく書けない素人としては、そうなっているとあとはhtmlだけ書けば使えるので・・・。＃質問の仕方がへたで申し訳ありません。 (^^; (^^; (^^;

ittochan
ベストアンサー率64% (2667/4137)

2002/09/07 19:33 回答No.1

<HTML> <HEAD> <TITLE></TITLE> <SCRIPT language=JavaScript>  </SCRIPT> </HEAD> <BODY> <select name="sel" onChange="set()"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="big">big</OPTION> <OPTION VALUE="small">small</OPTION> </select> <select name="sel" onChange="set()"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="red">red</OPTION> <OPTION VALUE="white">white</OPTION> </select> <select name="sel" onChange="set()"> <OPTION VALUE="" SELECTED>↓【選択してね】</OPTION> <OPTION VALUE="right">red</OPTION> <OPTION VALUE="left">white</OPTION> </select> <BR><INPUT SIZE=50 id="txt" > </BODY> </HTML> こんなんじゃぁ駄目？

質問者