parent().remove 无法正常工作答案

【问题标题】：parent().remove is not working correctlyparent().remove 无法正常工作
【发布时间】：2013-10-16 21:50:04
【问题描述】：

点击 .icon-trash 删除父级时遇到问题

<div class="ui-wrapper ui-draggable">
  <img id="link1" class="decor ui-resizable" src="http://i.imgur.com/nYkdOne.png">
  <div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
  <div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
  <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
  <img class="icon-layer-up icon-on-img" src="" style="z-index: 1;">
  <img class="icon-layer-down icon-on-img" src="" style="z-index: 1;">
  <img class="icon-trash icon-on-img" src="" style="z-index: 1;">
  <img class="icon-copy-el icon-on-img" src="" style="z-index: 1;">
</div>

我的 js 代码只删除带有 .icon-on-img 类的元素

$(document).on('click', '.icon-trash', function() {  
  $(this).parent().remove();
});

如何通过点击 .icon-trash 元素删除所有内容？

【问题讨论】：

代码真的被调用了吗？
您是否遇到任何错误？当我尝试您的代码时，它在 JsFiddle 中运行良好。 jsfiddle.net/SgDs6
哇，看看所有这些试图修复未损坏的答案的答案..
我想我的事件传播可能有问题
哪个问题？该代码工作正常。您是否暗示您的浏览器在实现事件冒泡时存在问题？这将是非常令人惊讶的。

标签： javascript jquery dom-manipulation

【解决方案1】：

试试这个

  $(document).ready(function () {
        $(".icon-trash").on("click", function () {
            $(this).parent().remove();
        });
    });

【讨论】：

【解决方案2】：

此处的工作示例：（单击橙色框）http://jsfiddle.net/cpEff/

刚刚将类 '.ui-wrapper' 从你的父 div 添加到你的 jQuery

$(document).on('click', '.icon-trash', function() {  
  $(this).parent('.ui-wrapper').remove();
});

【讨论】：

@mattias 是的，刚刚看到它并用问题更新答案
@lipenco 抱歉，如果没有 .parent() 中的类，它也可以工作，你确定你包含了 jQuery 吗？

【解决方案3】：

以下代码应该可以工作：

$('.icon-trash').on('click', function() {  
  $(this).parent().remove();
});

【讨论】：

我假设 op 方法用于委托。你上面的答案不会提供这个
请坚持英文。

【解决方案4】：

在事件中使用正文

$('body').on('click', '.icon-trash', function() {  
    $(this).parent().remove();
 });

工作 jsfiddle http://jsfiddle.net/HdMNY/

【讨论】：