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;
  }