使用 jQuery 单独关闭同一类的每个 div

Question

我有一段jQuery，它在同一类的几个div中淡入，有点像新闻提要。 例如，使用以下代码延迟地将<div class="dashboard_notification">逐个淡入

：

<script>
$('.dashboard_notification').hide(); // this or use css to hide the div
$(document).ready(function(){
    var time = 1000;
    $('.dashboard_notification').each(function() {
        $(this).delay(time).fadeIn(1000);
        time += 1000;
    });
});
</script>

现在我正在尝试做的是隔离其中的每一个（pref，而不必将div类更改为类似"dashboard_notification1/2/3/4"），以便用户可以单击以使用我分配的特殊关闭按钮div单独关闭每个新闻提要"dashboard_notification_close"

有人可以告诉我如何做到这一点吗谢谢，这是我目前用来关闭div 的代码，但这只会关闭所有新闻提要，因为它们都共享同一个div class="dashboard_notification"

<script>
$('.dashboard_notification_close').click(function(e) { //button click class name is myDiv 
  e.stopPropagation(); 
 }) 
 $(function(){ 
  $('.dashboard_notification_close').click(function(){   
  $('.dashboard_notification').delay(100).fadeOut(500);
 }); 
}); 
</script>

Answer 1

假设标记如下所示：

<div class="dashboard_notification">
...
    <div class="dashboard_notification_close"></div>
...
</div>

您可以使用this来引用单击的按钮，并closest到达其外部div：

$('.dashboard_notification_close').click(function(){   
    $(this).closest('.dashboard_notification').delay(100).fadeOut(500);
}); 

Answer 2

在单击函数中，$('.dashboard_notification')切换到 $(this) ，它只会在单击的元素上触发，而不是所有与选择器查询匹配的元素。