如何使元素可拖動和排序使用jQuery的列表？

Question

我有一個元素列表，我想使它可排序和可拖動使用Jquery。但是，當我們拖動特定元素時，它不應該與其他現有元素重疊。請任何人幫助我。

Answer 1

<script> 

$(function() { 

$(".abc").draggable(); 

}); 

</script> 
<ul> 
<li class="abc"> 1 </li> 
<li class="abc"> 2 </li> 
<li class="abc"> 3 </li> 
</ul> 

Answer 2

<script> 
$(function() { 
$(".abc").draggable({ 
connectToSortable: "#sortable", 
revert: "invalid" 
}); 
$("#sortable").sortable({ 
    revert: true 
}); 
$("#sortable").disableSelection(); 
}); 
</script> 
<ul id="sortable"> 
<li class="abc"> 1 </li> 
<li class="abc"> 2 </li> 
<li class="abc"> 3 </li> 
</ul>