jQuery 无法删除父级？

Question

我在 div 中有一个“可拖动”jquery ui 的元素。我正在尝试删除整个 div。我的元素看起来像

<div class="draggable">
    <img ...>
    <div class="delete">CLICK TO DELETE</div>
</div>

并且它有一个可拖动事件。我希望当您单击删除按钮时它会删除整个 div。但这似乎不起作用。我尝试过 $(this).parent/parents.remove ，但这些都不起作用，它们甚至不返回任何类型的对象 (console.log($(this) .parent()); 返回 [])。

我的删除功能看起来像

// Delete Image functionality
    $('.delete').click(function() {

        $this.parent().draggable('disable');

        // Post the DELETE request
        $.get('delete/', { d: '1' , id:photo }, function(data) {
            if (data == "true") {
                $(this).parent().remove();
            } else {
                alert("An error has been encountered, please try again later");
            }
        });
    });

知道发生了什么吗？

Answer 1

问题是，在对 $.get 的回调中，this 被设置为 jqXHR 实例。因此，如果您愿意，您可以执行 this.responseText 等操作。显然它不再设置到该元素。

您需要为元素指定一个不被覆盖的别名:

$('.delete').click(function() {
    var clicked = this;
    $this.parent().draggable('disable');

    // Post the DELETE request
    $.get('delete/', {d:'1',id:photo}, function(data) {
        if(data == "true") {
            $(clicked).parent().remove();
        }else{
            alert("An error has been encountered, please try again later");
        }
    });
});

还有多种其他方法可以做到这一点:最有效的是 varparent = $(this).parent().draggable('disable') (假设 draggable 是可链接的，它可能是)。另一种选择是通过事件的 currentTarget 属性:

$('.delete').click(function(event) {
    // ...
            $(e.currentTarget).parent().remove();

我认为我给出的版本可能最清楚地说明了为什么这对您不起作用，这就是我选择它的原因。