单击孩子时如何删除父母答案

【问题标题】：How do I remove a parent when a child is clicked单击孩子时如何删除父母
【发布时间】：2012-09-12 00:24:06
【问题描述】：

单击任何子图像时如何删除整个 div？这是我的 HTML：

<div id="list1">
        <img src="FILE1.JPG" class="img">
        <img src="FILE2.JPG" class="img">
        <img src="FILE3.JPG" class="img">
</div>

<div id="list2">
        <img src="FILE4.JPG" class="img">
        <img src="FILE5.JPG" class="img">
        <img src="FILE6.JPG" class="img">
        <img src="FILE7.JPG" class="img">
</div>

这里是 jquery：

$('.img').click(function() {
    var $img = $(this);
    $.ajax({
        url: 'save-image.php?q=' + $(this).attr('id'),
        dataType: 'json',
        success: function(data) {
            $img.closest('div').remove();
        }
    });
});

我需要在单击图像时运行更新脚本，但随后我需要整个 div 消失。此代码无效。

【问题讨论】：

stackoverflow.com/questions/9751521 stackoverflow.com/questions/5913761 stackoverflow.com/questions/9942294 stackoverflow.com/questions/8596468 stackoverflow.com/questions/6010260 stackoverflow.com/questions/3887648
你为什么要根据答案更新你的代码？
答案将 remove 语句置于成功之上并将 att id 保存到变量中。 $('img').click(function() { var ids = $(this).attr('id'); $(this).parent().remove(); $.ajax({ url: 'ajax .php?q=' + ids, dataType: 'json', 成功: function(data) { return data; } }); });

标签： javascript jquery html ajax jquery-ui

【解决方案1】：

你可以试试 parent 和 remove 方法

$('img').click(function() {
    var $this = $(this);
    $.ajax({
        url: 'ajax.php?q=' + $this.attr('id'),
        dataType: 'json',
         success: function(data) {
            $this.parent().remove();
         }
     });
});

【讨论】：

这个看起来超级简单，但它并没有像我期望的那样删除 div。

【解决方案2】：

    $('img').click(function() {

    var clicked = $(this);

    $.ajax({
        url: 'ajax.php?q=' + $(this).attr('id'),
        dataType: 'json',
        success: function(data) {

            clicked.parent('div:first').remove();

        }
      });
    });

【讨论】：

@user1614427 这段代码应该可以工作，虽然 :first 不是必需的，但你肯定还有其他问题。
射击，也没有解决。
如果不调用成功回调，它将永远无法工作。添加错误回调以查看它是否有效： error: function(data) {clicked.parent('div:first').remove();} jsbin.com/avuwab/7

【解决方案3】：

This 应该可以帮助您完成任务。

parent( [selector] ) 返回：jQuery 描述：获取父级当前匹配元素集中的每个元素，可选由选择器过滤。

页面上给出的第一个示例与您的问题几乎相同。

【讨论】：

【解决方案4】：

使用 jQuery 的 .parent() 和 .remove()

【讨论】：

那么谁对所有答案投了反对票？他们有什么问题吗？

【解决方案5】：

如果您使用的是 jQuery，那么您可以：

$('img').on('click', function(e) {
   $(this).parent().remove();
}

【讨论】：

【解决方案6】：

试试这个，

Live Demo

$('img').click(function(){    
  $(this).closest('div').remove();
});

如果你能给img分配一些类会更好

$('.img').click(function(){    
  $(this).closest('div').remove();
});

【讨论】：

谢谢。这行得通 - 至少我在进入演示后看到了它的工作原理。