jquery - 删除/删除与类最接近的元素

Question

我正在尝试删除/删除“.delete”按钮单击上最接近的“.step”。因此，它会删除 .delete 按钮上方的 .step。

 <div class="step"></div>
 <div class="new"></div>
 <div class="delete"></div>

<div class="step"></div>
 <div class="new"></div>
 <div class="delete"></div>

<div class="step"></div>
 <div class="new"></div>
 <div class="delete"></div>

这是我的 jQuery:

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

我应该如何处理这一步？感谢您的帮助!

Answer 1

考虑到 HTML，我建议:

$('.delete').click(function(){
    $(this).prevAll('.step').first().remove();    
});

JS Fiddle demo .

修改了上述内容(以防止第二次单击 .delete 元素时出现问题):

$('.delete').click(function(){
    $(this).prevUntil('.delete').first().prev('.step').remove();
});

JS Fiddle demo .

如果 .step 是祖先，或者包裹在父元素中，会容易得多:

<div>
    <div class="step"></div>
    <div class="new" id="addNextSlide"></div>
    <div class="delete"></div>
</div>

这将启用以下功能:

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

JS Fiddle demo .

引用文献:

• click() .
• find() .
• first() .
• parent() .
• prevAll() .
• prevUntil() .
• remove() .