使用jQuery或者纯JavaScript,我想通过第一个下拉框的选择来填充第二个下拉框。第一个下拉框的值是获取第二个下拉框行的条件。
onChange事件应该是什么样子的?
onChange事件应该是什么样子的?
以下是一种功能性但不太优雅的解决方案。这是一种基于首先选择美国(US)或加拿大(CA)来填充州/省选择列表的方法。默认情况下,US和US States是可见的。此方法依赖于简单的类命名约定,以根据其父国家对州选项进行分组。
JS代码:
$('#s_country').change(function() {
$('#s_state .state_CA').hide();
$('#s_state .state_US').hide();
$('#s_state').val('');
var value = $.trim($("#s_country").val());
$('#s_state').show();
$('#s_state .state_'+ value).show();
});
HTML:
<select name="s_state" id="s_state">
<option value="none"></option>
<? foreach ($states_us as $v):
$selected = ($v->state_code == $current_state)?'selected="selected"':''; ?>
<option class="state_US" value="<?=$v->state_code?>" <?=$selected?> ><?=ucfirst($v->state)?></option>
<? endforeach;?>
<? foreach ($states_ca as $v):
$selected = ($v->state_code == set_value('s_state'))?'selected="selected"':''; ?>
<option class="state_CA" value="<?=$v->state_code?>" <?=$selected;?>><?=ucfirst($v->state)?></option>
<? endforeach; ?>
</select>