如何将相同的jQuery代码应用于同一个类的两个实例？

Question

例如,我有这个代码:

$('.note .exit').click(function() {
  $('.note').fadeOut();
});

在我的HTML上有两个.exit和.note实例.如:

<div class="note">
        <img src="images/exit.png" class="exit"/>

        <p>Some text.</p>   
</div>

<div class="note">
        <img src="images/exit.png" class="exit"/>

        <p>Some other text.</p> 
</div>

问题是当我单击一个.note的关闭按钮(退出图像)时,另一个.note也会关闭.我如何修改代码,使其仅适用于我正在关闭的特定.note类？

Answer 1

使用.closest() ^[docs]获取与选择器匹配的最近祖先:

$('.note .exit').click(function() {
  $(this).closest('.note').fadeOut();
});

鉴于您的结构,您也可以使用.parent() ^[docs].