JavaScriptの質問をしたり答えたりする掲示板
JavaScriptに関する質問を何でもしていい掲示板です。匿名での投稿も可能です。どんなことでもどしどし書き込んでください。回答もどなたでも自由にできます。僕も回答できる内容であれば必ず回答します！
質問は下記に沿って書いていただくと回答しやすくなります。
- 実際のソースコードがある場合、可能な範囲で書いていただくと問題点を見つけやすくなります。
- 実際に発生したエラーメッセージがある場合、コピペしていただくと問題解決につながる可能性が高いです。
- 見た目上の問題の場合、スクリーンショットを貼ると状況が把握しやすくなります。
javascript超初心者です
学校の課題で三段階ドロップダウンを作りたいのですが途中頭がこんがらがってしまい
三個目を表示する方法いただきたくご教示頂きたく。。。。
以下コードです
1段階目(メイン)のプルダウンメニュー
＜select class="mainselect">
＜option value="">メイン＜/option>
＜option value="a">A＜/option>
＜option value="b">B＜/option>
＜/select>
2段階目(サブ)のプルダウンメニュー
＜select id="A" class="subbox">
＜option value="">サブ＜/option>
＜option value="aa">A-A＜/option>
＜option value="ab">A-B＜/option>
＜option value="ac">A-C＜/option>
＜/select>
＜select id="B" class="subbox">
＜option value="">サブ＜/option>
＜option value="ba">B-A＜/option>
＜/select>
3段階目(サブサブ)のプルダウンメニュー
＜select id="aa" class="subsubbox">
＜option value="">サブサブ＜/option>
＜option value="aa1">A-A１＜/option>
＜/select>
＜script type="text/javascript">
・ サブBOXを全て非表示にする
var allSubBoxes = document.getElementsByClassName("subbox");
for( var i=0 ; i
allSubBoxes[i].style.display = 'none';
}
・ 全てのプルダウンボックスごとに処理
var mainBoxes = document.getElementsByClassName('pulldownset');
for( var i=0 ; i
var mainSelect = mainBoxes[i].getElementsByClassName("mainselect");
・ メインのプルダウンメニュー
var subSelect = mainBoxes[i].getElementsByClassName("subbox");
・サブのプルダウンメニュー
mainSelect[0].onchange = function () {
・ 同じ親要素に含まれている全サブBOXを消す
var subBox = this.parentNode.getElementsByClassName("subbox");
・ 同じ親要素に含まれる.subbox
for( var j=0 ; j
subBox[j].style.display = 'none';
}
・ 指定されたサブBOXだけを表示する
if( this.value ) {
var targetSub = document.getElementById( this.value );
・「メインのプルダウンメニューで選択されている項目のvalue属性値」と同じ文字列をid属性値に持つ要素を得る
targetSub.style.display = 'inline'
}
}
});
・この後サブで選択したサブサブのみstyleのdisplayのをinlineにしたいのですがどうしたらいいでしょうか。。。
＜/script>