空后如何将可拖动元素重新添加到可放置元素

Question

我有一个可拖动/可拖放脚本，其中如果将可拖动对象拖放，则该div中的元素将追加到可拖放div中。 删除后，将显示一个清除按钮，以删除div中的内容，如下所示

$(e.target).append(ui.draggable.html() + '<br/>');
//can use $(this) or (e.target)
$("#add_friend").show().fadeOut(12000);
$(e.target).droppable("destroy");
$(e.target).append("<input type='button' name='Sub' value='clear'/>").click(function() {
    $(this).empty();
});

我遇到的问题是，从可拖放div中删除html之后，我无法重新拖动并再次追加。 此处显示的示例 。 我希望能够在删除内容后重新拖放元素。 我将不胜感激，知道如何解决此问题并理解为什么会这样。

Answer 1

此行正在删除使其成为拖放区的类。

$(e.target).droppable("destroy");

Answer 2

您不想破坏droppable，但要禁用它，您应该执行以下操作：

$(e.target).append(ui.draggable.html() + '<br/>');
            //can use $(this) or (e.target)
            $("#add_friend").show().fadeOut(12000);
            $(e.target).droppable("disable");
            $(e.target).append("<input type='button' name='Sub' value='clear'/>").click(function() {
                $(this).empty()
                       .droppable("enable");
            });