Question

在手风琴菜单中点击href时，我在向两个元素添加类时遇到问题。删除“current”类的实例，在单击的子菜单项中添加“current”类，并将其父项添加。我有手风琴工作，只要我点击父菜单项并出现子菜单。在这个例子中，我的意思是我点击“Second”和“Item 2.1”和“Item 2.1”出现。单击“第三个”和“第二个”，其子项将被隐藏，第三个及其子项将被显示。我想要做的是，一旦点击一个孩子，将“当前”添加到该子href元素及其父href（例如，点击href ID“two-one”并将“current”类添加到此元素以及到它的“nav-subtitle”ID）并从当前的href中删除“当前”类。

这是HTML： -

        <ul id="navigation">

            <li>
                <a href="index.html" class="nav-subtitle current">
                    Home
                </a>       
            </li>

            <li> 
                <a href="#" class="nav-subtitle">
                Second
                </a>
                <ul>
                    <li><a href="#" id="two-one">Item 2.1</a></li>
                    <li><a href="#" id="two-two">Item 2.2</a></li>
                </ul>
            </li>

            <li>
                <a href="#" class="nav-subtitle">
                    Third
                </a>
                <ul>
                    <li><a href="#" id="three-one">Item 3.1</a></li>
                    <li><a href="#" id="three-two">Item 3.2</a></li>
                    <li><a href="#" id="three-three">Item 3.3</a></li>                      
                </ul>
            </li>
        </ul>

我尝试了以下jQuery，但'parent'元素最终将'current'类添加到li元素，而不是使用类nav-subtitle添加href。如果我指定“nav-subtitle”ID，整个功能将失败： -

$("#two-one").click(function(){
        $( "#nav-subtitle" ).removeClass("current");
        $(this).parent().parent().parent("#nav-subtitle").addClass("current");   
        $(this).addClass("current");
});

Answer 1

我相信这段代码可以满足我的需要。

$("#two-one").click(function(){
        $('a.current').removeClass('current');
        $(this).parent().parent().siblings().addClass('current');
        $(this).addClass('current');
});

删除＆＃39;当前＆＃39;来自元素类的课程＆＃39; current＆＃39;，添加＆＃39; current＆＃39;到父href，最后添加class＆＃39; current＆＃39;点击了href。

jQuery Accordion将类添加到当前Href及其父Href

1 个答案: