Question

首先，这是一个JSFiddle：

<div class="tocButtonsDiv">
<div class="tocListItems">
    <div class="tocItemDiv">
        <div class="tocItem editTocTitle" data-pageid="51" data-title="Bacon Ipsum">Bacon Ipsum</div>
    </div>
    <div class="tocItemDiv">
        <div class="tocItem editTocTitle" data-pageid="43" data-title="Pirate Ipsum">Pirate Ipsum</div>
    </div>
    <div class="tocItemDiv">
        <div class="tocItem editTocTitle" data-pageid="48" data-title="Klingon Ipsum">Klingon Ipsum</div>
    </div>
    <div class="tocSubListItems">
        <div class="tocSubItemDiv">
            <div class="tocSubItem editTocSubTitle" data-proposaltocid="8" data-title="klingon anchor">klingon anchor</div>
        </div>
        <div class="tocSubItemDiv">
            <div class="tocSubItem editTocSubTitle" data-proposaltocid="10" data-title="klingon anchor too">klingon anchor too</div>
        </div>
    </div>
    <div class="tocItemDiv">
        <div class="tocItem editTocTitle" data-pageid="52" data-title="Plastic Onion Rings">Plastic Onion Rings</div>
    </div>
    <div class="tocSubListItems">
        <div class="tocSubItemDiv">
            <div class="tocSubItem editTocSubTitle" data-proposaltocid="11" data-title="Condiments">Condiments</div>
        </div>
    </div>
    <div class="tocItemDiv">
        <div class="tocItem editTocTitle" data-pageid="53" data-title="Porcupines For Fun">Porcupines For Fun</div>
    </div>
    <div class="tocItemDiv">
        <div class="tocItem editTocTitle" data-pageid="54" data-title="Tragedy At 7-11">Tragedy At 7-11</div>
    </div>
    <div class="tocSubListItems">
        <div class="tocSubItemDiv">
            <div class="tocSubItem editTocSubTitle" data-proposaltocid="9" data-title="tragedy anchor">tragedy anchor</div>
        </div>
    </div>
    <div class="tocItemDiv">
        <div class="tocItem editTocTitle" data-pageid="57" data-title="Something Fancy">Something Fancy</div>
    </div>
</div>
</div>

基本上，我有一个项目和子项列表，你可以看到你是否运行小提琴。较大的框是项目，较小的框是子项目，分组在其父项下面。到目前为止有意义吗？

我希望能够在每个集合上执行jqueryUI sortable（）例程;意思是，我希望能够重新排序Items（大按钮），然后在其父项下重新排序subItem（小按钮）。

我把整个东西都放在一个名为tocButtonsDiv的div下面。里面是一个名为tocListItems的div，它包含所有项目（＆＃34; tocItem＆＃34;）（以及它们各自的子项目）。

现在它在Fiddle中的方式是它唯一可行的方式，但它并没有将子项保持为父项，事实上，它将子项视为一个单独的组（是否存在＆＃ 39;一，二或更多）。我知道我的标记可能需要一些工作，但我想知道.sortable（）方法是否有更多的选项我不知道这会让我将子项与项关联。

FWIW，所提出的小提琴根本不起作用;不知道为什么。这是我第一次真正使用JSFiddle。

感谢您的帮助！

jQuery可以使用分组元素进行排序

0 个答案: