无法删除父项

Question

我试图删除<a>的父项，这是HTML：

<div>123321<a class="del" rel="32" href="#">X</a></div> 

这是代码：

$(function() 
{ 
    $('.del').click(function(e) 
    { 
     $(e).parent().remove(); 
    }); 
}); 

但没有发生，为什么？ JSFIDDLE.

Answer 1

（如在其他答复中提到，而且你有可能使用e.target引用当前对象还您可以使用this）。所以不要传递事件e，您可以使用e.target传递当前单击元素的对象，请查看下面的示例。

$(function() { 
 
    $('.del').on('click', function(e) { 
 
     $(e.target).parent().remove(); 
 
    }); 
 
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 
<div>123321<a class="del" rel="32" href="#">X</a></div>

Answer 2

您正在将event对象传递给jQuery，而不是当前元素。使用this代替e您的处理程序中：

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

在上面的例子中，请注意e用于表示所发生的事件，而this用于表示该事件的目标元素。

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

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 
<div>123321<a class="del" rel="32" href="#">X</a></div>