Question

我在<div class="items"持有这些元素

时使用了draggable

<div class="item">
    <div class="thumb">
        <img id="image" src="source.png" />
    </div>
    <div class="description">
        <p>Some description here</p>
    </div>
</div>

现在在droppable上，我只想保留该div的图像。我已尝试使用以下代码，但似乎无法正常工作......

$("#dropbar").droppable({
    accept: ".deal-itinerary-item .row",
    hoverClass: correct_placeholder,
    activeClass: active_placeholder,
    revert: false,
    tolerance: "pointer",

    drop: function (event, ui) {
        var dragging = ui.draggable.clone().find("img").remove();
        $(this).append(dragging).addClass("dropped");
    }
});

认为这会找到img并从可拖动的内容中删除任何其他内容。

我做错了什么，我该如何解决？

谢谢！

Answer 1

您正在删除示例中的img，因为它是您在调用remove()时jQuery对象所选择的内容。

 var image = ui.draggable.find("img").clone();
 $(this).append(image).addClass("dropped");

我不确定你要删除的是什么，如果它是原始的可拖动的，或者你只是克隆了太多的东西。但是如果你想删除原来的draggable：

 var image = ui.draggable.find("img").clone();
 $(this).append(image).addClass("dropped");
 ui.draggable.remove();

可能有效。

Answer 2

您可以直接克隆img。

drop: function (event, ui) {
    var dragging = ui.draggable.find("img").clone();
    $(this).append(dragging).addClass("dropped");
}

几个div，如何找到图像并删除父div

2 个答案: