html - 单击下拉菜单更改内容

Question

我正在尝试使用 2 个下拉菜单制作一个贝宝项目。我想让它在第一个下拉菜单将根据选择更改第二个下拉菜单的位置。我该怎么做呢？我尝试在第一个菜单上使用带有 onchange 的 javascript，在第二个菜单上使用 .innerHtml。

<tr><td><input type="hidden" name="on0" value="Year">Year</td></tr><tr><td><select name="os0">
<option value="None">None </option><!-- Show list 1 -->
<option value="2015">2015 </option><!-- replace list 1 with list 2  -->
<option value="2016">2016 </option><!-- replace list 1 with list 2 -->
<option value="2017">2017 </option><!-- replace list 1 with list 2 -->
</select> </td></tr>


<tr><td><input type="hidden" name="on1" value="Size">Size</td></tr><tr><td><select name="os1">
<!-- List 1 -->
<option value="Youth X-Small">Youth X-Small </option>
<option value="Youth Medium">Youth Medium </option>
<option value="Youth Large">Youth Large </option>
<option value="Youth X-Large">Youth X-Large </option>
<option value="Adult Small">Adult Small </option>
<option value="Adult Medium">Adult Medium </option>
<option value="Adult Large">Adult Large </option>
<option value="Adult X-Large">Adult X-Large </option>
<option value="Adult XX-Large">Adult XX-Large </option>
</select> </td></tr>

<!-- List 2 -->
<option value="Youth Large">Youth Large</option>
<option value="Youth X-Large">Youth X-Large</option>
<option value="Adult Small">Adult Small</option>
<option value="Adult Medium">Adult Medium</option>
<option value="Adult Large">Adult Large</option>
<option value="Adult X-Large">Adult X-Large</option>
<option value="Adult XX-Large">Adult XX-Large</option>

Answer 1

使用jquery的change函数

$("#idofselect").change(function(){ });