Jquery UI可排序：如果超出<ul> </ul> </li>，则更改<ul>中的<li> </li>

Question

我有可排序的项目，它们连接在不同的ul。

之间

我希望有可能将li放在ul之外，从而将li转换为ul。

这是我的代码：

<script>
    $(function() {
        $( ".drop" ).sortable({
            connectWith: ".drop",
        });

        $( ".sortable" ).sortable({
            items: '.drop',
        });
    });
</script>

<div class="sortable">
    <ul id="sortable1" class='drop'>
        <li class="ui-state">Item 1</li>
    </ul>

    <ul id="sortable2" class='drop'>
        <li class="ui-state">Item 1</li>
        <li class="ui-state">Item 2</li>
    </ul>

    <ul id="sortable3" class='drop'></ul>
</div>