jquery從一個到另一個選擇選項

Question

在以下多選框中單擊更改按鈕時，我想填充id="p_prod中的所有選定項目「以顯示在id="s_prod"中，並在p_prod中刪除它們並單擊還原時，我想讓它們從s_prod刪除和重新填充他們p_prod在相同的順序以前它是..how做到這一點

<select size="10" multiple="multiple" id="p_prod"> 
<option value="1">prod1</option>         
<option value="2">prod2</option> 
<option value="3">prod3</option> 
<option value="4">prod4</option> 
</select> 

<select mulitple="multiple" id="s_prod"> 
</select> 
<input type="button" id="change" value="change" onclick="val();"/> 
<input type="button" id="revert" value="revert" onclick="val();"/> 

function val() 
{ 
    $('#p_prod option:selected').removeAttr('selected'); 
} 

Answer 1

可以使用option:selected得到selcted選項和附加到其他select使用appendTo()，這將刪除選項自動從第一選擇。

Live Demo

$('#p_prod option:selected').appendTo('#s_prod'); 

要恢復你需要存儲索引，你需要一些像這樣的事情，

Live Demo

$('#change').click(function() { 
    $('#p_prod option:selected').each(function() { 
     $(this).data('prevIndex', $(this).index()); 
     $(this).appendTo('#s_prod'); 
    }); 
}); 

$('#revert').click(function() {  
    debugger 
    $('#s_prod option').each(function() {   
     currentOptIndex = $(this).data('prevIndex'); 
     if(currentOptIndex > 0) 
      $('#p_prod option').eq(currentOptIndex).after(this);    
     else 
      $('#p_prod').prepend(this);    
    }); 
});