重置切换或点击其他元素重置切换？

Question

我正在尝试设置一个单击显示菜单，其中包含两个单独的菜单。

一个男人应该点击菜单，另一个女人点击。

如果单击一个，则另一个应该消失（如果它可见），如果单击菜单，它也应该消失。或者，如果再次点击顶级菜单链接，它也应该隐藏子菜单。

我让它听起来比现在更复杂但是这是我到目前为止的代码：

http://jsfiddle.net/GLZK5/7/

请注意，如果单击“men”，则会显示子菜单。单击女性也会显示子菜单并隐藏“男性”子菜单，但如果您单击“男性”，它只会隐藏“女性”并且不会显示“男性”......

我很困惑..

Answer 1

步骤

1. 加载页面时，隐藏所有菜单。
2. 现在对于处理程序，当您单击它时，您有两种情况。
   1. 查看子菜单是否可见，如果是，则隐藏子菜单。
   2. 如果子菜单不可见，则隐藏所有内容并仅显示子菜单

使用此代码：

$(document).ready(function() {
    $(".gen-sel > li > ul").hide();
    $(".gen-sel > li > a").click(function(){
        if ($(this).next().is(":visible"))
            $(this).next().hide();
        else
        {
            $(".gen-sel > li > ul").hide();
            $(this).next().show();
        }
    });
});​

演示：http://jsfiddle.net/GLZK5/10/