css - Jquery切换类

Question

我有一个使用以下脚本开发的手风琴菜单

$(document).ready(function(){

    $('li.button a').click(function(e){
     $(this).addClass('active');

        /* Finding the drop down list that corresponds to the current section: */
        var dropDown = $(this).parent().next();

        /* Closing all other drop down sections, except the current one */
        $('.dropdown').not(dropDown).slideUp('100');
        dropDown.slideToggle('100');

        /* Preventing the default event (which would be to navigate the browser to the link's address) */
        e.preventDefault();     })      

});

单击菜单时我需要添加 .active 类，因此我在 jquery 中添加了 addclass ，它正在添加类，但问题是单击另一个菜单时应删除该类。我什至也尝试了切换类，但没有奏效。

而且我还希望在打开页面时默认打开第一个 li 项目。

Answer 1

只需在函数的开头添加它：

$('li.button a').click(function(e){
    $('li.button a').removeClass('active');
    $(this).addClass('active');
    ...
});

Answer 2

尝试这个

$('li.button a').each(function(){
    $(this).removeClass("active").addClass("no-active"); // your non active class
});

Answer 3

$('li.button a').click(function(e){
     if($(this).hasClass('active')) // this line verifies if the actual clicked element is already active
         return false;  // you can return false or do another operation here

     $('li.button a.active').removeClass('active');

     $(this).addClass('active');

     /* Finding the drop down list that corresponds to the current section: */ 
        var dropDown = $(this).parent().next(); 

        /* Closing all other drop down sections, except the current one */ 
        $('.dropdown').not(dropDown).slideUp('100'); 
        dropDown.slideToggle('100'); 

        /* Preventing the default event (which would be to navigate the browser to the link's address) */ 
        e.preventDefault();     
})