javascript - 容器之间的JQuery拖放问题

Question

好的，我在这里遇到了一个问题，我有可拖动和可放置的东西，奇怪的是，一旦我将它放在容器上，我必须重新创建可拖动以将其移回。

基本上我有起源

$("#mykeys ul li").draggable({
revert:"invalid",
helper: "clone",
cursor: 'move'});

然后我有可放置的块。我遇到的问题是如何让实际的可放置块在彼此之间拖放。

所以基本上我可以将n drop从原点拖放到类容器中，但我不能在类容器之间拖放n

我需要使用可排序的吗？

这是 JS 小提琴

http://jsfiddle.net/rmatakajr/FN7Xx

感谢您的帮助

Answer 1

尝试

$(".drop-container").droppable({
    activeClass: "ui-state-highlight",
    accept: "#mykeys ul li, .drop-container li",
    //connectWith: ".drop-container",
    drop: function (event, ui) {
        $(this).empty();
        $(ui.draggable).appendTo(this);
    },
    out: function (event, ui) {
        console.log('dragged out');
    }
});

演示：小提琴