Question

我正在使用PHP来回显我的导航选项列表，这是由于每个用户的不同权限而完成的。该列表分为多个列表项，其中包含一些列表项，一个是用户点击该组的标题，其中列出了子菜单。我已经能够使用这段javascript设置当前打开的菜单的活动类：

function initMenu() {
    $('#menu ul').hide();
    $('#menu li a').click(function() {
        var checkElement = $(this).next();
        if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
        //slide up if visible (works fine).
        }
        if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
        //otherwise slideDown (works fine too).
        }
    });
}

$(document).ready(function() {markActiveLink();initMenu();});

function markActiveLink() {
   $("#menu li ul li a").filter(function() {
       return $(this).prop("href").toUpperCase() == window.location.href.toUpperCase();
   }).addClass("active")
   .closest('ul') //some markup problem
   .slideDown('normal');
}

这是我正在显示的列表标记：

echo "<ul id='menu'>";
 echo "<li><a href='#'>Adminstration</a>
<ul><li>";
echo "<a href='path_to_page/usermanagement.php'>User Management</a>";
echo "</li><li>";
// and some more items

此处管理是我的组标题，用户管理是我的子组。现在使用上面的代码我仍然无法在不同的页面上展开我的菜单，以便用户知道他在哪个页面上？

Answer 1

我想出了问题，由于一些奇怪的原因，它需要我先声明变量：

 var checkEle = $("#menu li ul li a").filter(function() {
       return $(this).prop("href").toUpperCase() == window.location.href.toUpperCase();
   }).addClass("active")
   .closest('ul');   //get the closest ul 
   console.log(checkEle);
   checkEle.slideDown('normal');

使用javascript设置导航的活动类

1 个答案: