3 つの選択ボックスで構成されるドロップダウン選択メニューを作成しようとしています。3 番目のボックスは、1 番目の選択ボックスで選択されたオプションに基づいて特定のオプションを表示/非表示にします。
ここで誰かがこれに対する解決策を提案できるかどうか疑問に思っていました。
これは、私が持っている 3 つの選択ボックスの簡易版です。
<select class="product" id="select_1" name="product">
<option selected="selected" value=""> Choose Category </option>
<option value="Mens Suits"> Mens Suits </option>
<option value="Womens Suit"> Womens Suits </option>
<option value="Children Suit"> Children Suits </option>
</select>
<select class="color" id="select_2" name="color">
<option selected="selected" value=""> Choose Color </option>
<option value="Blue">Blue</option>
<option value="Red">Red</option>
<option value="Green">Green</option>
</select>
<select class="size" id="select_3" name="size">
<option selected="selected" value=""> Choose Size </option>
<!-- Mens Sizes Below -->
<option value="36">36</option>
<option value="38">38</option>
<option value="40">40</option>
<!-- Womens Sizes Below -->
<option value="30">30</option>
<option value="29">29</option>
<option value="28">28</option>
<!-- Children Sizes Below -->
<option value="12">12</option>
<option value="11">11</option>
<option value="10">10</option>
</select>
36
上記の例では、最初の選択ボックスからのオプションが選択されたときに、3 番目の選択ボックス ( 、38
、および40
)から最初の 3 つのオプションを表示できるようにしたいと考えていますMens Suits
。同様に、Womens Suits
1 番目のボックスから を選択すると、オプション30
、29
、および28
が 3 番目のボックスに表示されます。チルドレンスーツも同様です。
これが理にかなっていることを願っています。ありがとうございました。