Question

我已经使用jQuery UI设置了嵌套拖放，但是，我想知道如何以创建新子列表的方式拖动项目。例如。如果我将项目1.2.2向右拖动，它将在项目1.2.1下创建一个新的子级别。

这是我的代码：

<div id="mylist">
    <ul>
        <li>Item #1</li>
        <li>Item #2</li>
        <ul>
            <li>Item #1.1</li>
            <li>Item #1.2</li>
            <ul>
                <li>Item #1.2.1</li>
                <li>Item #1.2.2</li>
                <li>Item #1.2.3</li>
                <li>Item #1.2.4</li>
            </ul>
            <li>Item #1.3</li>
            <li>Item #1.4</li>
        </ul>
        <li>Item #3</li>
        <li>Item #4</li>
    </ul>
</div>

$(document).ready( function() {    
    $("#mylist ul").sortable( {
        items: "li",
        connectWith: 'ul',
    } );
} );

更新

实际上。我的示例代码完全无法正常工作。我只是注意到，当我拖动父母时，也应该拖动它的所有孩子，这是目前没有的。我也喜欢它能够做到这一点。

Answer 1

您需要将UL嵌套到LI中，如下所示：

<div id="mylist">
<ul>
    <li>Item #1</li>
    <li>Item #2
        <ul>
            <li>Item #1.1</li>
            <li>Item #1.2
                <ul>
                    <li>Item #1.2.1</li>
                    <li>Item #1.2.2</li>
                    <li>Item #1.2.3</li>
                    <li>Item #1.2.4</li>
                </ul>
            </li>
            <li>Item #1.3</li>
            <li>Item #1.4</li>
        </ul>
    </li>
    <li>Item #3</li>
    <li>Item #4</li>
</ul>

尝试实例：http://jsfiddle.net/pyEa4/ - 它的小马车，但是孩子们被父母拖了。

jQuery UI嵌套列表创建新的子列表

1 个答案: