jquery - 需要从同一个列表项中添加和删除活动类

Question

此代码在单击时添加活动类，如果我单击另一个列表，它工作正常，但如果我再次单击同一链接，它不会从中删除活动类。请帮帮我。

提前致谢。

$(document).ready(function(){
    $("li.menulink a").click(function(e){
    e.preventDefault();
    var thisList = $(this).next();
    thisList .toggle();
    $('li.menulink div').not(thisList).hide();
    $('a').removeClass('active');
    $(this).addClass('active');

    //$(this).removeClass("active");
});

}); 

<ul class="allcategorymenu">
            <li class="menuheading menulink"><h1>All Categories</h1></li>
            <li class="mobile menulink"><a href="#"><span>Mobile &amp; Accessories</span></a>
            <div class="submenu" style="display:none;">
                <ul>
                    <li><a href="1.html">All Jewelry</a></li>
                    <li><a href="2.html">Diamond Jewelry</a></li>
                    <li><a href="3.html">Silver Jewelry</a></li>
                    <li><a href="#">Pearl Jewelry</a></li>
                    <li><a href="#">Fashion Jewelry</a></li>
                    <li><a href="#">Gemstone Jewelry</a></li>
                    <li><a href="#">Spiritual Jewelry</a></li>
                </ul>
            </div>
            </li>
            <li class="mens menulink"><a href="#"><span>Men's Apparel</span></a>
            <div class="submenu" style="display:none;">
                <ul>
                    <li><a href="1.html">All Jewelry</a></li>
                    <li><a href="2.html">Diamond Jewelry</a></li>
                    <li><a href="3.html">Silver Jewelry</a></li>
                    <li><a href="#">Pearl Jewelry</a></li>
                    <li><a href="#">Fashion Jewelry</a></li>
                    <li><a href="#">Gemstone Jewelry</a></li>
                    <li><a href="#">Spiritual Jewelry</a></li>
                </ul>
            </div>
    </li>
    </ul>

Answer 1

$(document).ready(function(){
    $("li.menulink a").click(function(e){
        e.preventDefault();
        var $this = $(this),
            thisList = $this.next();
        thisList.toggle();
        $('li.menulink div').not(thisList).hide();
        $('a').not($this).removeClass('active');
        $this.toggleClass('active');
    });
});

此代码将从所有<a>未被点击的标签中删除活动类，然后在该标签上切换活动类。您现有的代码从所有锚标记中删除了该类，然后将其添加到活动标记中，无论它是否被单击。

Answer 2

$("li.menulink a").click(function(e) {
    e.preventDefault();
    var thisList = $(this).next();
    thisList.toggle();
    $('li.menulink div').not(thisList).hide();
    $(this).toggleClass('active ');
    $('a.active').not(this).removeClass('active ');
});

演示