jQuery找到最近的類，並將其刪除

Question

我試圖刪除list_product整個塊，如果該特定的delete類被點擊。我對jquery很陌生，至今仍在學習。

<div class='list_product'> 
    <div class='row'> 
     <div class='delete'>x</div> 
     <div class='title'>Standing Fan</div> 
    </div> 
</div> 
<div class='list_product'> 
    <div class='row'> 
     <div class='delete'>x</div> 
     <div class='title'>Standing Fan 2</div> 
    </div> 
</div> 
<div class='list_product'> 
    <div class='row'> 
     <div class='delete'>x</div> 
     <div class='title'>Standing Fan 3</div> 
    </div> 
</div> 
<div class='list_product'> 
    <div class='row'> 
     <div class='delete'>x</div> 
     <div class='title'>Standing Fan 4</div> 
    </div> 
</div> 

的Jquery：

$('.delete').click(function() { 
    $(this).find('.list_product').remove(); 
}); 

不工作。我可否知道爲什麼以及如何修復它？謝謝

Answer 1

只是做$(this).closest('.list_product').remove()。
API ref：http://api.jquery.com/closest/
find搜索當前元素的子元素。在這種情況下，.delete元素沒有任何子元素。相反，closest去增加通過DOM，尋找類list_product的第一個祖先。希望這可以幫助。

Answer 2

您可以在父元素上使用event delegation或使用Closest方法

最近是很容易使用：

var id = $("button").closest("div").attr("id"); 

Answer 3

試試這個：

$(document).on('click', '.delete', function(e) { 
    e.preventDefault(); 
    $(this).closest('.list_product').remove(); 
    return false; 
});