如何通过更改另一个下拉列表来更改一个下拉列表值

Question

我有2个下拉列表，我想这样做，以便当有人从dropdown1中选择例如值Abbeville时，dropdown2会自动更改为值饼图。这可能是使用jquery吗？

<select id="county">
<option value="select" selected>Select</option>
<option value="Abbeville">Abbeville</option>
<option value="Aberdeen">Aberdeen</option>
</select>

<select id="ctype">
<option value="select" selected>Select</option>
<option value="pie">Pie Chart</option>
<option value="bar">Bar Chart</option>
<option value="line">Line Chart</option>
</select> 

脚本

$("#county").change(function(){ 
   $("#ctype").val($(this).val());
})

Answer 1

尝试使用.change()功能。

$('#county').change(function(){
  $("#ctype option").eq($(this).find(':selected').index()).prop('selected',true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<select id="county">
<option value="select" selected>Select</option>
<option value="Abbeville">Abbeville</option>
<option value="Aberdeen">Aberdeen</option>
</select>

<select id="ctype">
<option value="select" selected>Select</option>
<option value="pie">Pie Chart</option>
<option value="bar">Bar Chart</option>
<option value="line">Line Chart</option>
</select>