jQuery 可排序的子项不会进入父项

Question

如果这些父项中的一个被清空（子项移到另一个父项中），那么您将无法将子项移回空的父项中。

https://jsfiddle.net/k8x7om75/

    // Sort the parents
    $(".sortMenu").sortable({
        containment: "document",
        items: "> div",
        tolerance: "pointer",
        cursor: "move",
        opacity: 0.7,
        revert: 300,
        delay: 150,
        placeholder: "menuPlaceholder",
        start: function(e, ui) {
            ui.placeholder.height(ui.helper.outerHeight());
        }
    });

    // Sort the children
    $(".menuItems").sortable({
        items: "> div",
        tolerance: "pointer",
        containment: "document",
        connectWith: '.menuItems'
    });

通常我会自己做，但我不知道 JavaScript 或它的任何口味。对不起，如果这看起来微不足道，但我需要这方面的帮助。谢谢

Answer 1

添加以下内容css：

.ui-sortable{
   padding: 5px;
 }

您遇到这个问题是因为一旦您的父容器变空，父容器中可排序 div 的高度就会变为 0，没有地方让子容器被拖回其中。

如果你不想要额外的填充，那么css如下：

 .ui-sortable{
     min-height: 10px;
  }