将元素放在不是父元素的元素内（JQuery UI 可排序）答案

【问题标题】：Put element inside an element, which is not the parent (JQuery UI sortable)将元素放在不是父元素的元素内（JQuery UI 可排序）
【发布时间】：2014-10-01 07:55:32
【问题描述】：

我创建了一个测试页面，其中每个块内的 div 都是可排序的。但是怎么可能，让用户将 div 拖出它的父级，并放入另一个可排序的 div 中？

JSFiddle：http://jsfiddle.net/zq8bqufs/

代码：

$( ".sortable, body" ).sortable();

【问题讨论】：

你需要使用 .draggable() 来实现它
为什么每个<div> 都有可排序的类..？你为什么将sortable() 应用于body..？
我想重新排序所有元素，包括主体内部以及其他可排序对象内的元素
你为什么要尝试用可排序的树来制作树？当然，必须有更少混乱的方式来做到这一点。你看过jsTree或类似的东西吗？

标签： javascript jquery html css jquery-ui

【解决方案1】：

您可以使用items 选项来确定元素内的哪些项目应该是可排序的。

JSFIDDLE

HTML

<div class="sortable">
    <div class="items">
        <div class="items">asd</div>
        <div class="items">eee</div>
        <div class="items">fff</div>
        </div>
    <div class="items">asd</div>
    <div class="items">
        <div class="items">vvv</div>
        <div class="items">abbsd</div>
        <div class="items">mmm</div>
    </div>
    <div class="items">dsa</div>
</div>

Javascript

$('.sortable').sortable({
    items: '.items'
});

【讨论】：

【解决方案2】：

你需要使用connectWith，更多关于here的信息。

我在这里更新（并简化了）你的功能：http://jsfiddle.net/vrx6r264/

【讨论】：

我无法将第一个大块放入另一个大块