jquery - 使 jQuery droppable 接受来自使用 connectWith 的可排序项的项目

Question

我有一个可排序列表，它使用 connectWith 确保它只能在自己的列表类型中排序。

现在我正在尝试制作一个可放置的垃圾桶元素，当对项目进行排序时，该元素会出现在视口(viewport)底部。该元素位于列表的上下文之外，并且仅删除放置在其上的任何元素。如果您熟悉的话，所需的功能与从 Android 手机桌面删除快捷方式相同。

问题是，虽然我的垃圾桶是一个接受 '*' 的 droppable，但我的 sortable 只被告知 connectWith 其他 '.dropZone' 项目，这意味着我无法获得我的任何项目可排序元素会导致垃圾元素上出现悬停状态。

我尝试在 start 事件上将每个可排序项变成可拖动项，但当然我没有在确切的时刻拖动该可拖动项，因此它没有被激活。是否可以同时满足这两个要求，还是我必须手动检测垃圾桶悬停？

Answer 1

由于 connectWith 接受选择器，因此您可以为其提供一个选择器，以选择其他连接的列表和垃圾箱。

$("#sortable1, #sortable2").sortable({
    connectWith: '.connectedSortable, #trash'
}).disableSelection();

$("#trash").droppable({
    accept: ".connectedSortable li",
    hoverClass: "ui-state-hover",
    drop: function(ev, ui) {
        ui.draggable.remove();
    }
});

示例:http://jsfiddle.net/petersendidit/YDZJs/1/