Question

我正在使用JQuery的draggable()和droppable()函数，并且在尝试删除当前选定的DIV时遇到问题。

每次将对象拖到我的#canvas上时，都会在#canvas中附加一个新的DIV，并添加.newLetter类。我的HTML看起来如下所示：

HTML：

<div id="canvas">
    <div id="trash"></div>
    <div class="newLetter"></div>
    <div class="newLetter"></div>
    <div class="newLetter"></div>
    ...
</div>

一旦在画布上，我想要选择然后将对象拖动到“垃圾桶”并被删除。我只想删除当前选择的DIV，但是如果我用.newLetter类删除所有元素，我只能使它工作。否则，不会删除任何内容，或删除错误的元素（例如垃圾桶本身或整个画布）。

这是我目前的 JQuery：

// Delete Letters
$("#trash").droppable({
    accept: '.newLetter',
    drop: function(event, ui) {
        $(".newLetter").remove();
    }
});

我尝试过以下所有操作，但没有一个能正常工作：

$(this).remove();
$(".newLetter", this).remove();
$(this).sibling().remove();
$(this).parent().remove();
$(this).(".newLetter").remove();
$(this).closest().remove();
$(this).closest().sibling().remove();

我相信我已经筋疲力尽了所有可能性。任何想法??

Answer 1

在drop event中，您可以使用ui.draggable

引用拖动的元素引用

$("#trash").droppable({
    accept: '.newLetter',
    drop: function(event, ui) {
        $(ui.draggable).remove();
        //or even ui.draggable.remove(); since ui.draggable is a jQuery object
    }
});

JQuery：删除当前选中的div

1 个答案: