如何使用第一個下拉列表的onChange事件填充另一個下拉列表？

Question

與jQuery或簡單的JavaScript，我想填充從第一個下拉列表中選擇第二個下拉列表。 第一個下拉列表的值是獲取第二個下拉列的條件。

onChange事件是怎麼樣的？

Answer 1

的功能，但不太優雅的解決方案如下。根據先選擇美國（美國）還是加拿大（CA），這是填充州/省選擇列表的一種方式。美國和美國國家在默認情況下是可見的。這種方法依賴於簡單的類命名約定來根據父母國家對州選項進行分組。

的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> 

希望這有助於。

Answer 2

居然有一個插件，做到了這一點......

http://code.google.com/p/jqueryselectcombo/