JS隐藏div，如果它有一个通过JS添加的类

Question

我正在编写通过 JS 将 active 类添加到 div 的代码。

我想做的是，当那个 div 有 active 类时，隐藏另一个 div。但是，由于 active 类是通过 JS 添加的，所以这段代码不起作用：

if($("#section3").hasClass("active")) {
    $(".menu").fadeOut("fast");
}

我想我需要使用 on 函数：.on()

类似的东西，但它不起作用...有什么想法吗？

$("#section3").on( function() {
    $(this).hasClass('active') {
        $(".menu").fadeOut("fast");
    }
});

编辑：

恐怕我无法粘贴代码，因为我正在使用插件。 This is the one that I am using，所以你可以在那里看到功能。

我已经添加了这个项目符号菜单：

<ul id="menu">
    <li data-menuanchor="slide1"><a href="#slide1"><span></span></a></li>
    <li data-menuanchor="slide2"><a href="#slide2"><span></span></a></li>
    <li data-menuanchor="slide3"><a href="#slide3"><span></span></a></li>
    <li data-menuanchor="slide4"><a href="#slide4"><span></span></a></li>
</ul>

每张幻灯片在视口上时都有一个active class，所以我想要实现的是当最后一个滑块处于活动状态时，隐藏菜单

Answer 1

$(document).ready(function(){
$('section').click(function(){

$(this).addClass('active');
if($('section').hasClass('active')){

$('ul#menu').hide();

}
});

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section>check</section>
<ul id="menu">
<li data-menuanchor="slide1"><a href="#slide1"><span></span></a></li>
    <li data-menuanchor="slide2"><a href="#slide2"><span></span></a></li>
    <li data-menuanchor="slide3"><a href="#slide3"><span></span></a></li>
    <li data-menuanchor="slide4"><a href="#slide4"><span></span></a></li>


</ul>

Answer 2

其他部分和 li 具有活动类，因此您可以使用类似的东西或使用 afterSlideLoad 事件（如果它依赖于幻灯片）

$(window).on("scroll",function() {
  if ($('#menu li:last-child').hasClass("active")) {
    ("#menu").fadeOut("fast")
  }
})

或者您可以使用 slideIndex 来检查您是否在最后一张幻灯片上。看这里>afterSlideLoad