jQuery UI toggleClass

Question

之前我曾经问过类似的问题，我已经看过几个类似的Q＆amp; As已经，但是它们不符合我的要求（或者我根本没有js知识让它们起作用！）

我有一个simple css/jquery menu设置，它使用jQuery UI toggleClass来显示和隐藏子菜单。

我想通过在点击另一个子菜单时关闭任何打开的子菜单来改进这一点。任何人都可以向我解释如何做到这一点？感谢。

Answer 1

将此添加到您的函数中：

$(this).parent().siblings().find('ul:not(.navhidden)').addClass('navhidden', 'fast');

这是你的小提琴，更新：http://jsfiddle.net/abKhH/1/

---

P.S。 @Colin的解决方案也有效，但我认为上述解决方案有点好，因为它可以同时打开和关闭面板。

Answer 2

响应有点慢，但有额外的答案永远不会伤害！ 编辑：这确实有轻微的性能提升，因为它只运行$（'＃main-nav a.dd'）选择器一次由于链接。如果您不熟悉，.end（）会通过转到上一个选择来取消.next（）。

$('#main-nav a.dd').next().addClass('navhidden')
    .end().click(function() {
        $('#main-nav a.dd').not(this).next().each( function() {
            if ( !$(this).hasClass("navhidden") ) {
                $(this).addClass("navhidden");
            }
        });
        $(this).next().toggleClass('navhidden', 'fast');
        return false;
});

http://jsfiddle.net/6Qer7/

Answer 3

$('#main-nav').hasClass('firstClass') ? $('#main-nav').addClass('SecondClass'): $('#main-nav').hasClass('firstClass');