Javascriptで質問です２

質問

セレクトボックスから選択してテキストや画像を出力する以下のコードがあるのですが、これをセレクトボックスを２段階で選択後にテキストや画像を出力したいのです。
詳しい方がいらっしゃれば、ご教示いただければ幸いです。よろしくお願いいたします。

<div class="col-auto my-1">
<label for="sample">選択してください</label>
</div>
<div class="col-auto my-1">
<select class="form-control" id="sample" onchange="viewChange();">
<option value="select1">one</option>
<option value="select2">two</option>
<option value="select3">three</option>
</select>
</div>
<div class="col-auto my-5">
<div id="Box1" class="my-5">
<p>one</p>
</div>
<div id="Box2" class="my-5" style="display:none;">
<p>two</p>
</div>
<div id="Box3" class="my-5" style="display:none;">
<p>three</p>
</div>
</div>

<script>
function viewChange(){
if(document.getElementById('sample')){
id = document.getElementById('sample').value;
if(id == 'select1'){
document.getElementById('Box1').style.display = "";
document.getElementById('Box2').style.display = "none";
document.getElementById('Box3').style.display = "none";
}else if(id == 'select2'){
document.getElementById('Box1').style.display = "none";
document.getElementById('Box2').style.display = "";
document.getElementById('Box3').style.display = "none";
}
else if(id == 'select3'){
document.getElementById('Box1').style.display = "none";
document.getElementById('Box2').style.display = "none";
document.getElementById('Box3').style.display = "";
}
}

window.onload = viewChange;
}
</script>

回答No.1

retorofan

課題の趣旨は
「２つのセレクトボックスを操作して
　ＩＤが「Ｂｏｘ？」の箇所に結果を表示せよ」
ということなのでしょうか？

条件が
「セレクトボックスを２段階で選択」
ということなのに、１つしかありません。