jQuery菜单,在它的不同阶段对菜单的不同控制

jquery menu, different control of menu in different stages of it

本文关键字:菜单 控制 jQuery      更新时间:2023-09-26

嗨,伙计们,你能帮我做菜单吗?我希望第二阶段中的所有按钮只能在 tyme 处打开一个。假设我按下阶段 2 一个按钮,然后我按下阶段 2 b 按钮,阶段 2 按钮会自行收缩,但保持阶段 1 完好无损。我想让它与许多阶段 2 按钮一起使用,而不仅仅是我现在拥有的两个(阶段 2 a阶段 2 b)。提前非常感谢。

function prepareList() {
    $('#game_menu_mail').find('li:has(ul)')
    .click( function(event) {
        if (this == event.target) {
            $(this).toggleClass('expanded');
            $(this).children('ul').toggle('medium');
        }
        return false;
    })
    .addClass('collapsed')
    .children('ul').hide();
};

http://jsfiddle.net/t1ko1tny/4/

您可以使用

.is()来检查单击的元素是否是第二阶段元素。如果是,则在显示正在单击的项目之前隐藏所有第二阶段项目:

function prepareList() {
    var $gameMenuMail = $('#game_menu_mail'),
        secondStage = '#game_menu_mail > li > ul';
    $('#game_menu_mail').find('li:has(ul)').click(function (event) {
        if (this == event.target) {
            var $this = $(this);
            if ($this.is(secondStage + ' > li')) {
                $this.closest(secondStage).find('li')
                    .removeClass('expanded')
                    .children('ul').hide('medium');
            }
            $this.toggleClass('expanded').children('ul').toggle('medium');
        }
        return false;
    })
        .addClass('collapsed')
        .children('ul').hide();
};

JSFiddle