Question

我在我的项目中使用导航菜单。菜单有几个菜单，再次有子菜单和超级菜单。当我点击一个子菜单的链接时，它的项目将出现，当我点击它时它会消失在另一个链接（没有子菜单）但我的问题是：当我点击一个包含子菜单的链接时，之前链接的子菜单将不会消失。所以最后所有链接都会保持打开状态（显示他们的子菜单）只需单击一个链接就可以了将消失。

$(document).ready(function() {
$('#right-menu > ul li').click(function(event) {
    if($(this).find('ul ').hasClass('active'))
    {
        $(this).find('ul').removeClass('active').slideUp('400');
    }else{
        $(this).find('ul').addClass('active').slideDown('400');
    }
});
});

Answer 1

更改您的逻辑，以便检查点击的元素是否处于活动状态。然后向上滑动任何同时处于活动状态的ul标记。最后，只有在点击的元素未处于活动状态时才向下滑动。

类似的东西：

$(document).ready(function() {
    $('#right-menu > ul li').click(function(event) {
        var activeStart = false;

        if($(this).find('ul').hasClass('active'))
        {
            activeStart = true;
        }

        $('ul.active').removeClass('active').slideUp('400');

        if(!activeStart) {
            $(this).find('ul').addClass('active').slideDown('400');
        }
    });
});

Answer 2

你的问题是。如果用户点击带有子链接的链接，则子链接必须向下滑动。当点击另一个链接时，活动子链接必须向上滑动，单击的子链接必须向下滑动。你可以试试这个。将类<ul class='non-active'>添加到链接

    $(document).ready(function() {
$('#right-menu > ul li').click(function(event) {
   $('.non-active').slideUp('400');
$(this).find('ul').slideDown('400');
});
});

我应该如何消失子菜单？

2 个答案: