jquery菜单，不同阶段的菜单控制

Question

大家好你能帮帮我菜单吗？我希望第二阶段的所有按钮只能打开一个。假设我按第2阶段按钮，然后按第2阶段 按钮，第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/

Answer 1

您可以使用.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