jQuery可排序的组和子组

时间:2013-11-18 20:20:46

标签: jquery jquery-ui jquery-ui-sortable

我有一个div,其中我希望所有h2pdiv元素都可以排序。我还希望在那里有子可排序的组,我希望主要的元素和子组的元素可以相互排序。因此,应允许主组中的元素放入子组并返回。

我已经建立了一个jsFiddle,希望能展示我想要的东西。我们的想法是,浅灰色元素应该能够与黑色灰色一起放入组中,反之亦然。

http://jsfiddle.net/LpmfY/1/

JS

$(document).ready(function () {
    $('.sort_these').sortable();
});

HTML

<div class='sort_these'>
     <h2>...</h2>

    <p>...</p>
    <p>...</p>
    <div class='sort_these'>
         <h2>...</h2>

        <p>...</p>
    </div>
    <div>...</div>
</div>

任何人都可以帮助我朝正确的方向发展吗?

2 个答案:

答案 0 :(得分:3)

你应该从connectWith option开始,类似这样:

<强> Working Example

$(document).ready(function () {
    $('.sort_these').sortable({
        connectWith: '.sort_these'
    });
});

答案 1 :(得分:2)

你应该检查connectWith:http://jqueryui.com/sortable/#connect-lists