javascript - 如何将相同的 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] .