- ベストアンサー
セレクトメニューの選択によって次に表示されるDivを変更したい
http://crownjewel.okwave.jp/qa5291819.html 前回こちらで質問したのですが、 解答を頂いて、出来た！と思ったのですが・・・ DIVで表示したセレクトメニューを選択すると、セレクトメニューが消えてしまいます。 どのようにしたら表示したままに出来るのでしょうか？ 宜しくお願い致します。
- cherry0910
- お礼率37% (6/16)
- JavaScript
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
#1です。 ＞北海道の市町村のセレクトメニュー って<select>～～</select>のことでしょうか？ <form name="sys_form"> <select name="test" onchange="showthis(this)"> <option value="none">------ <option value="FP01">北海道 <option value="FP02">青森 <option value="FP03">秋田 </select> <div id="FP01"> <select name="hokkaido"> <option value="none">------ <option value="CT01">旭川 <option value="CT02">札幌 <option value="CT03">函館 </select> </div> <div id="FP02"> <select name="aomori"> <option value="none">------ <option value="CT01">青森 <option value="CT02">十和田 <option value="CT03">八戸 </select> </div> <div id="FP03"> <select name="aomori"> <option value="none">------ <option value="CT01">秋田 <option value="CT02">能代 <option value="CT03">大曲 </select> </div> </form> で何も問題ないはずですが…？ まぁ、最初にデフォルトを1個表示するか全部非表示にしておくなどする方が良いような気がしますが…
その他の回答 (1)
- fujillin
- ベストアンサー率61% (1594/2576)
どういう実装をしていて、何をしたいのかよくわかりませんが… こういうことではないの？（元の回答のままだとこうなる） <html> <head> <script type="text/javascript"> function showthis(sel) { var elements = document.getElementsByTagName("div"); for(var i=0;i<elements.length;i++){ if (elements[i].id.indexOf("FP")==0){ elements[i].style.display = "none"; } } var value = sel.options[sel.selectedIndex].value; if (value.indexOf("FP")==0){ document.getElementById(value).style.display = "block"; } } </script> </head> <body> <form name="sys_form"> <select name="test" onchange="showthis(this)"> <option value="none">------ <option value="FP01">北海道 <option value="FP02">青森 <option value="FP03">秋田 </select> </form> <div id="FP01">北海道のコメント</div> <div id="FP02">青森県のコメント</div> <div id="FP03">秋田県のコメント</div> </body> </html> ＞どのようにしたら表示したままに出来るのでしょうか？ もとのスクリプトではセレクトされていないところを非表示にしていますが、それを非表示にしなくて良いということ？ それなら displa="none" にしているところをコメントアウトしてしまえばよいけれど（もっと言うならその部分の6行が不要なので削除）、スクリプトを使う意図が不明。
お礼
解答ありがとうございます。 やりたいことの説明が足りなかったみたいですみませんでした。 補足させていただきます。 <body> <form name="sys_form"> <select name="test" onchange="showthis(this)"> <option value="none">------ <option value="FP01">北海道 <option value="FP02">青森 <option value="FP03">秋田 </select> <div id="FP01">北海道の市町村のセレクトメニュー</div> <div id="FP02">青森県の市町村のセレクトメニュー</div> <div id="FP03">秋田県の市町村のセレクトメニュー</div> </form> </body> </html> こういう形です 今困っているのが、市町村をセレクトメニューから選ぶとDivごとまた非表示になってしまうのです。 宜しくお願い致します。
お礼
ありがとうございました。 出来ない出来ないと・・・ よくソースを見比べて見ましたら、 市町村のセレクトメニュ－のところにも onchange="showthis(this)" が入ってしまっていた自分のミスでした。 お手数おかけしました。 それと、記載していませんでしたが、 市町村はセレクトメニューはCSSでnone;設定にしています。 まだまだデーターの受け渡し等の問題が発生しまっています。 また機会があったらご教授お願い致します。