Jquery 空 bootstrap 列的可排序问题

Question

我在一些栏目中打了 bootstrap 个面板。现在，我正在尝试使用 jquery sortable 来安排此面板，但我无法使其正常工作。

查看 jsfiddle：https://jsfiddle.net/umnvgory/

我的问题：如果我用左手拖动面板并将其放到右边，一切正常。但是之后我希望能够将面板从右侧拖回左侧的空列，但即使是占位符也不会移到左侧。

我已将列的 padding-top: 10px 属性设置为实际将它们留空 space。

我的 javascript 看起来像这样：

 $("#container-wrapper").sortable({
   connectWith: ".connectedSort",
   items: "div.panel",
   tolerance: 'pointer',
   revert: true,
   placeholder: 'placeholder',
   forceHelperSize: true,
   zIndex: 9999
 }).disableSelection();

Answer 1

通过这个 post 找到了我的解决方案。 jQuery UI drop on empty container/list not working

确保你定义了右边的 $().sortable() class 并将它们与 sortable()

的 connectWith: 参数组合

Jquery 空 bootstrap 列的可排序问题

Jquery sortable issue on empty bootstrap column

javascript

jquery

panel

jquery-ui-sortable

twitter-bootstrap