的jQuery：下拉列表中選擇項目

Question

克隆後，我在那裏從克隆（）函數生成選項的下拉列表中，例如：

<select id="drop1"> 
     <option value="0">Select...</option> 
     <option value="Apples">Apples</option> 
     <option value="Bananas">Bananas</option> 
     <option value="Orange">Orange</option> 
     <option value="Cats">Cats</option> 
     <option value="Dogs">Dogs</option> 
     <option value="Candy">Candy</option> 
    </select> 

    <select id="drop2">    
    </select> 

     ... 
<script> 
    $('#drop1').children().clone().appendTo('#drop2'); 
</script> 

但我想知道的是選擇下拉列表後如何克隆項目項目。顯然，在該事件的onchange（），例如，觀看第一下拉：

<select id="drop1"> 
     <option value="0">Select...</option> 
     <option value="Apples">Apples</option> 
     <option value="Bananas">Bananas</option> 
     <option value="Orange">Orange</option> 
     <option value="Cats" selected>Cats</option> --> select item 
     <option value="Dogs">Dogs</option> 
     <option value="Candy">Candy</option> 
    </select> 

克隆結果：

​​

我的目的是產生2場的範圍（靜態數據）。我希望我能幫上忙。

Answer 1

fiddle。

$('#drop1').change(function() { 
    $('#drop2').empty(); 
    $("#drop1 option:selected").nextAll().clone().appendTo('#drop2'); 
}); 

Answer 2

嘗試使用對兒童.slice，

$('#drop1') 
    .children() 
    .slice($('#drop1')[0].selectedIndex + 1) 
    .clone() 
    .appendTo('#drop2'); 

DEMO

編輯：平變化的#drop1

$('#drop1').change(function() { 
    $('#drop2') 
     .empty() 
     .append(
       $(this).children().slice(this.selectedIndex + 1) 
      .clone() 
     ); 
}); 

DEMO