如何根据其他下拉选择的值显示下拉选择？

Question

假设我有一个下拉选择选项如下图所示：

<form> 
    <select name="option" > 
       <option value="">Select a Value:</option> 
       <option value="1">Option 1</option> 
       <option value="2">Option 2</option> 

    </select> 
</form> 

当任何用户选择选项1我想显示以下下拉列表中选择它旁边立即

<select name="name" > 
       <option value="">Select a person:</option> 
       <option value="john">john</option> 
       <option value="Micheal">Micheal</option> 

    </select> 

或者，如果任何用户选择选项2我想显示下面的下拉列表中选择它旁边立即

<select name="class" > 
       <option value="">Select a person:</option> 
       <option value="Class 1">Class 1</option> 
       <option value="Class 2">Class 2</option> 

    </select> 

你请请告诉我如何做到这一点？ 我正在使用Codeigniter。

Answer 1

$('select[name="option"]').change(function(){ 
    $('.hidden').hide(); 
    if(this.value == 1){ 
     $('select[name="name"]').toggle(); 
    } 
    else if(this.value == 2){ 
     $('select[name="class"]').toggle(); 
    } 
}); 

小提琴：http://jsfiddle.net/maniator/Z6Upj/

Answer 2

这给一个镜头：

$(function(){ 
    $("select[name='option']").change(function(e){ 
     if ($(this).val() == "1") 
      $("select[name='name']").show(); 
    }); 
});