jquery - 是否可以控制 jQuery UI Sortable 助手的溢出？

Question

我的标记大致如下所示:

<div class='root'>
    <div class='wrapper'>
        <div class='column'>
            ...
        </div>
        ...
    </div>
</div>

根 div 有 overflow: auto，宽度/高度可能会改变。列具有固定宽度并向左浮动。包装器具有对应于列宽总和的固定宽度。最终结果是 View 中的一组水平布局的列，当列高或总列宽超出其边界时显示滚动条。

我已将可排序的 jQuery UI 应用于包装器 div，因此可以对其中的列进行排序。这很好用，除了一个问题:sortable 给被排序的元素 position: absolute，这显然将它从正常布局中删除了。因此，如果该列非常高，整个页面都会出现一个滚动条，直到该元素放回原位。

有没有办法让可排序助手在排序时保持包含在滚动 div 中？

Answer 1

我认为这可能适合您。

您可以选择在何处附加您的可排序助手:

$( ".selector" ).sortable({ appendTo: 'div.wrapper' });

来自文档:

“appendTo:定义随鼠标移动的助手在拖动过程中被附加到的位置(例如，解决重叠/zIndex 问题)。”