我有一个带有
id='alpha'
的下拉列表,其中有三个选项,并且它们的值用逗号分隔。<select class="browser-default" id="alpha">
<option value="a,b,c">One</option>
<option value="d">Two</option>
<option value="e,f">Three</option>
</select>
另一个带有值的下拉框 beta
。 根据在第一个下拉菜单 alpha
中选择的选项,这些值应该出现在第二个下拉菜单 beta
中。
<select class="browser-default" id="beta">
<option value="a">First</option>
<option value="b">Second</option>
<option value="c">Third</option>
<option value="d">Fourth</option>
<option value="e">Fifth</option>
<option value="f">Sixth</option>
</select>
如果从 alpha
下拉菜单中选择了 One
。则在 beta
下拉菜单中,只应该存在 a,b,c
这些值对应的选项 - First Second Third
我尝试过的方法: 没有使用逗号分隔值。
$('#alpha').on('change', function () {
$('#alpha').html('');
if ($('#alpha').val() == "One") {
$('#alpha').append('<option value="a">First</option>');
$('#alpha').append('<option value="b">Second</option>');
$('#alpha').append('<option value="c">Third</option>');
}
});