- 締切済み
プルダウンメニューの再選択時
いつもお世話になります。 プルダウンメニューを誤って選択した時などに、 上の階層に戻って再選択をする場合、 一番上の階層のプルダウンに戻ると下層のプルダウンが消えて、 改めて初めからの選択が可能なのですが、 たとえば二番目の階層のプルダウンに戻った場合、 プルダウンが消えずに、さらに下、下へとプルダウンが作成されてしまいます。 戻ったところよりの下の階層のプルダウンだけを消すにはどのようにしたらよいですか？ <script language="javascript"><!-- x = document.getElementsByTagName("select"); function showthis(obj) { for(i=1;i<x.length;i++) { x[i].style.display = "none"; } if(!obj) return false; document.getElementById(obj).style.display = "inline"; } function showthis2(obj) { for(i=6;i<10;i++) { x[i].style.display = "none"; } if(!obj) return false; document.getElementById(obj).style.display = "inline"; } function showthis3(obj) { for(i=10;i<16;i++) { x[i].style.display = "none"; } if(!obj) return false; document.getElementById(obj).style.display = "inline"; } function showthis4(obj) { for(i=16;i<22;i++) { x[i].style.display = "none"; } if(!obj) return false; document.getElementById(obj).style.display = "inline"; } function jump(url) { if(!url) return false; window.open(url,""); } // --> </script> <style type="text/css"><!-- select { display:none; } #item0 { display:inline; } --></style>
- MAZDA_MPV
- お礼率30% (9/30)
- JavaScript
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- leap_day
- ベストアンサー率60% (338/561)
こんにちは 前回のは第1階層ですべて消して第2階層で第3階層を消すようにしていたので何も残らなかったのだと思います 今回のは第4階層、第5階層にいって第2階層を選択したら残っているという感じではないでしょうか？ 今回提示したように下の階層をすべて消すようにしたらどうでしょう？ function showthis(obj) { for(i=1;i<x.length;i++) { x[i].style.display = "none"; } function showthis2(obj) { for(i=6;i<22;i++) { x[i].style.display = "none"; } function showthis3(obj) { for(i=10;i<22;i++) { x[i].style.display = "none"; } item0 onchange="showthis(this.value)" item1 onchange="showthis2(this.value)" item7&item8 onchange="showthis3(this.value)" 残りのitem onchange="jump(this.value)"
- leap_day
- ベストアンサー率60% (338/561)
こんにちは <body> ・ ・ <select name="item0">～</select> ←最初に出てきた<select>がx[0]になります <select name="item1">～</select> ←以下x[1] <select name="item2">～</select> ←x[2] ・ ・ <select name="item15">～</select> ←x[15] で前回のはitem0が第1階層、item1～item3が第2階層、item4～item15が第3階層という構造にしています その上でitem1を選択したときに展開されるitem4(x[4])～item7(x[7])をitem1をセレクト選択したときにshowthis2(obj)で非表示にしています(for(i=4;i<8;i++){x[i] で） おそらくfor(i=●;i<●;i++)の●の部分がずれている為に消されずに残っているのではないかと思います あれでしたらshowthis2,showthis3,showthis4を統合して第2階層を選択したときに第3階層の<select>をすべて非表示にして対象のものだけを表示するようにしては？ 数が増えている（？）様なので前回ので言うと for(i=4;i<8;i++) { function showthis2(obj)内｝ →for(i=4;i<16;i++) function showthis3(obj) { } →削除 function showthis4(obj) { } →削除 <select id="item2" onchange="showthis3(this.value)"> →<select id="item2" onchange="showthis2(this.value)"> <select id="item3" onchange="showthis4(this.value)"> →<select id="item3" onchange="showthis2(this.value)"> で注意すべきは<body>～<select name="item0">の間に他の<select>が無いのでitem0がx[0]になっているということです 間に別の<select>があればその数だけx[?]の？がずれていく点です <body> <select>～</select> ←x[0] <select>～</select> ←x[1] <select name="item0">～</select> ←x[2] function showthis(obj) { for(i=3;i<x.length;i++) function showthis2(obj) { for(i=6;i<18;i++) という感じで・・・ 逆にitem15以降にこの階層式選択以外のまったく別の<select>がある場合も修正が必要になります function showthis(obj) { for(i=0; i<？;i++) この『?』の部分が修正になります
補足
ありがとうございます。 ちょっと状況が変わったので補足します。 第一階層item0 第二階層item0(item1～item5) 第三階層item1(item6～item9) item2,item3,item4,item5 についてはここでOPENWINDOW 第四階層item7(item10～item15),item8(item16～item21) item6はここでOPEN 第五階層 item10～item21をOPEN。 昨日いただいたソースを元にこんな感じにしました。 おかげさまで画面表示はされるようになったのですが、 選びなおしたりするとプルダウンがいっぱいになってしまうのです。
お礼
毎度毎度ありがとうございます。 教えていただいたようにやってみましたが、解決しませんでした。。。 item0を選択しなおすと下層のプルダウンが全部消えるんですけど。 何でなんでしょうか・・・。