jquery - 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>

Jクエリ:

$('.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 を調べて、 class を持つ最初の祖先を探しますlist_product。お役に立てれば。

Answer 2

これを試して：

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

Answer 3

親要素でイベント委任を使用するか、 Closestメソッドを使用できます

Closest は非常に使いやすいです:

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