jquery - 将一个项目拖到 div 列表下方

Question

我有一个可拖动的：

<ul>
    <li>Option 1</li>
</ul>

    <script type="text/javascript">
    $(function() {
        $( "li" ).draggable({
            connectToSortable: //I don't where what should be configured here
        });
    });
    </script>

<div></div>
<div></div>
//add item here

我正在尝试拖动“选项 1”，以便将其拖动到现有 div 列表中的最后一个 div 下方，如何启用？我想我需要以某种方式跟踪 div 列表？

Answer 1

<script>
    $(function() {
        $( "#sortable" ).sortable({
            revert: true
        });
        $( "#draggable" ).draggable({
            connectToSortable: "#sortable",
            helper: "clone",
            revert: "invalid"
        });
        $( "ul, li" ).disableSelection();
    });
    </script>

Answer 2

我的解决方案是在 div 列表下添加一个新 div，在这个 div 中添加一个 css 类并使其可排序。