Question

我有一个div：

<div>
Hello there
<img src="cnnc.png" />
</div>




   <div id="cart">
<div class="placeholder">drop here</div>
    </div>

我希望能够将它拖到我的droppable框中，并将该div的所有内容附加到我的droppable框中。问题是我的可放置代码只将文本附加到框中，如何更改它以附加所有内容：

$("#cart").droppable({
        activeClass: "ui-state-default",
        hoverClass: "ui-state-hover",
        accept: ":not(.ui-sortable-helper)",
        drop: function(event, ui) {
            $(this).find(".placeholder").remove();
            $("<li></li>").text(ui.draggable.text()).appendTo(this);
        }

Answer 1

你可以这样做：

$("#cart").droppable({
    activeClass: "ui-state-default",
    hoverClass: "ui-state-hover",
    accept: ":not(.ui-sortable-helper)",
    drop: function(event, ui) {
        $(this).find(".placeholder").remove();
        $("<li></li>").append(ui.draggable.contents().clone()).appendTo(this);
    }
});

这实际上是使用.contents()克隆元素，如果您需要任何事件处理程序和数据，请改用.clone(true)。

Jquery Draggable和Droppable，删除完整的div内容

1 个答案: