jquery - Jquery 垂直滑动菜单

Question

我正在制作一个具有子级别的垂直导航菜单。当用户单击顶层链接时，通过给它类“活动”来显示子菜单。如果正在显示子级菜单并单击另一个顶级链接，我想从当前显示的子级菜单中删除“活动”类。我曾尝试从所有子级菜单中调用 remveClass，但我不起作用。请我获得一些关于如何实现这一目标的指导。

<nav class="side-nav-wrap">
        <ul class="list-unstyled nav-icons-wrap">
            <li>
                <a href="" class="navbar-trigger" data-target="#homeLinks">
                    <i class="fa fa-home nav-icon"></i>
                    <span class="nav-icon-label">Home</span>
                </a>
                <ul class="list-unstyled subnav-drawer" id="homeLinks">
                    <li>
                        <a href="">
                            Test1
                        </a>
                    </li>
                </ul>
            </li>
        </ul>
    </nav>

jQuery

$(document).on('click','.navbar-trigger', function(e) {
            var $this = $(this);

            if ($this.attr('data-target')){
                var $target = $this.attr('data-target')

                $($target).toggleClass('active');

                e.preventDefault();

            } 
        });

css

.subnav-drawer {
position: absolute;
background-color: #FFFFFF;
width: 145px;
top:0px;
bottom: 0px;
left:85px;
display: none;}

.active{
display: block;}

标签： jquery

Answer 1

您可以在适当的位置使用下一个代码来删除当前拥有它的元素上的活动类：

$(".active").removeClass("active");