jQuery可排序兄弟分組

Question

我想知道是否可以將可排序項目分組，如果一個類存在下一個兄弟姐妹。這裏是一個簡化版本的HTML看起來像：

<div class="itemClass">A</div> 
<div class="itemClass">B</div> 
<div class="itemClass groupWith">C</div> 
<div class="itemClass">D</div> 

我需要它，所以如果你拖動B，C去與它。 A，C和D會按照正常方式單獨排序。組規則是，如果它沒有groupWith並且直接的兄弟有一個groupWith類，那麼把它們放在一起。

我想避免讓小組成爲小孩，但如果沒有其他方式，我將不得不看看那個。

有沒有辦法做到這一點？我認爲最糟糕的情況是我將這些項目移到後面，但我希望排序是拖動組，而不僅僅是單個項目。

Answer 1

沒有很好的方法來做到這一點（我知道）。

我會去的方式是向B添加一個屬性，該屬性具有該ID或某物以標識C.然後，在可排序的.update函數中，可以檢查排序後的元素是否具有此屬性，如果是這樣然後追加C.

一些東西一樣

$(".sortable").sortable({ 
 
    update: function(event, ui){ 
 
    if (ui.item.attr('connectedTo')){ 
 
     $('#'+ui.item.attr('connectedTo')).detach().insertAfter(ui.item); 
 
    } 
 
    } 
 
}).disableSelection();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<div class="sortable"> 
 
<div id="A">A</div> 
 
<div id="B" connectedTo="C">B</div> 
 
<div id="C">C</div> 
 
<div id="D">D</div> 
 
</div>