可排序不拖動和投擲的

Question

觀看演示http://jsfiddle.net/nivea75ml/5NhFA/1/正常工作。

在這裏，底部的綠色塊可以拖放到黑暗的加利區域。另外，我希望3個塊可以排序，例如，如果Block2先被拖入深灰色區域，Block3應該移動到Block2的位置。

當前排序功能無拖動功能&可拖拽，查看http://jsfiddle.net/nivea75ml/sNnAe/。但是它不與可拖動&投擲的工作，看到http://jsfiddle.net/nivea75ml/5NhFA/1/。

任何人都可以幫我嗎？提前致謝！

Answer 1

聽起來像是你只是想使用可排序與連接列表：http://jqueryui.com/demos/sortable/#connect-lists

我修改你的第一個的jsfiddle：

HTML：

<div class="demo"> 

    <div id="droppable" class="drp"> 

    </div> 
    <div id="draggableElements" class="drp"> 
     <div class="draggable"> 
      <p>Sen1</p> 
     </div> 
     <div class="draggable"> 
      <p>Sen2</p> 
     </div> 
     <div class="draggable"> 
      <p>Sen3</p> 
     </div> 

    </div> 
</div> 

的Javascript：

$(function() { 

      $("#draggableElements, #droppable").sortable({ 
        connectWith: ".drp", 
        placeholder: "ui-draggable" 
       }); 

    }); 

這使得上面的灰色區域也可以排序，其中可能會或可能不會完全滿足您的需求。如果你想一個排序項放到一個投擲的，並能夠將其帶回成一個排序，看看這個：jQuery Sortable and Droppable。