单击时删除DIV

Question

我有一个DIV,当我点击DIV中包含的链接时,我想删除它.这是我有的:

<div id="clients-edit-wrapper">
    <div class="close-wrapper">
        <a href="#" class="close-div">Close</a>
    </div>
</div>

当我点击"关闭"时,我想clients-edit-wrapper删除.我正在寻找一种方法来通过引用Close链接的父DIV来实现这一点,在这种情况下,它是clients-edit-wrapper.

任何帮助将不胜感激!

下面的黄色回答:

$('.close-div').click(function(){
   $(this).parent().parent().remove();
});

这仅适用于您要删除的元素是两个父母.就我而言,这正是我所需要的.

Answer 1

给你的HTML标记

更新为.on()

$('.close-div').on('click', function(){
    $(this).closest("#clients-edit-wrapper").remove();
});

更灵活.closest,这使您可以选择更多的父母或更少的父母.

对于集合中的每个元素,通过测试元素本身并遍历DOM树中的祖先来获取与选择器匹配的第一个元素.

编辑
(添加相关资源)
请参阅live()上的jQuery文档

从jQuery 1.7开始,不推荐使用 .live()方法.使用.on()附加事件处理程序.旧版jQuery的用户应该使用.delegate()而不是.live().

据我所知,这是由于内存问题/问题所致live().

这个答案在很多层面都是错误的.首先,不要使用直播.它被弃用了.其次,你假设要删除的元素总是两个父母.最后,这个答案明确地提供了来自别人的答案的解决方案,这意味着原作者应该获得它的声誉.我非常强烈地认为这不应该是接受的答案. (5认同)
@FastTrack你没有使用直播,但是你正在使用答案的顶部,它本身鼓励使用直播？那里有点混乱.两次调用父级意味着此代码不会扩展到覆盖目标为三个项目或其中一个的其他实例.调用"最接近的"比调用"父"更好,因为"最接近的"将从任何深度起作用.当然它也有它的缺点,因为它假设目标总是父. (4认同)

Answer 2

这是一个解决方案:

$(".close-div").on("click", function(event) {
    $("#clients-edit-wrapper").remove();
    event.preventDefault();
});

要使#clients-edit-wrapper元素相对于.close-div元素,您可以使用parent().parent()或closest使用ID:

$(this).parent().parent().remove();                  // will do
$(this).closest("#clients-edit-wrapper").remove();   // the same

但是,最后一个没有意义,因为页面元素的ID应该是唯一的,并且不会有另一个#clients-edit-wrapper.