javascript - 使用 Jquery 突出显示菜单

Question

我有一个菜单，当选择一个特定的菜单项时，它会突出显示。 现在，当菜单中有子项时，问题就来了。我想选择菜单的父项和子项。 谁能帮帮我。

下面是我用来突出显示菜单的 html 和 javascript。

 <ul class="sidebar-menu">
        <li class="header">MENU OPTIONS</li>

       <li><a onclick="getView(this,"menu","title");" title="First" menu="First" url="Folder/First" href="#"><i class="fa fa-book"></i><span>First Page</span></a></li>

       <li><a onclick="getView(this,"menu","title");" title="Second" menu="Second" url="Folder/Second" href="#"><i class="fa fa-bell"></i><span>Second Page</span></a></li>



      <li class="treeview active"><a href="#"><i class="fa fa-edit"></i><span>Third Page</span><i class="fa fa-angle-left pull-right"></i></a>

<ul class="treeview-menu menu-open" style="display: block;">
    <li><a onclick="getView(this,"menu","title");" title="Child 1" menu="Child 1" url="Folder/Page" href="#"><i class="fa fa-circle-o"></i>First Child</a>
    </li>
    <li><a onclick="getView(this,"menu","title");" title="Child 2" menu="Child 2" url="Folder/Page" href="#"><i class="fa fa-circle-o"></i>Second Child</a>
    </li>

    </ul></li>

        </ul>

JavaScript 代码:

 $(document).ready(function () {
if (localStorage.menu !== undefined) {
    $('.sidebar-menu>li').removeClass('selectedMenu');
    $(".sidebar-menu>li>a[menu='" + localStorage.menu + "']").parent().addClass('selectedMenu');
}
else {
    $(".sidebar-menu>li>a[menu='Home']").parent().addClass('selectedMenu');
}

Answer 1

试试这个

$('.treeview-menu > li>a').click( function() { 
                $(this).closest("ul").siblings('a').addClass('selectMenu');
            });