1

我在 HTML 中创建了一个“下拉菜单”，当您单击某个元素时会出现该菜单。如果您单击该元素，它将应用一个“选定”类，li这将导致出现子菜单：

jsFiddle 示例

我现在有代码可以在单击菜单项时显示/隐藏菜单。如果选择了不同的菜单，它将从中删除选定的类并将其切换到单击的菜单上：

$("#menu").on("click", "li.dropdown", function(event) {
    event.preventDefault();
    event.stopPropagation();

    $(this).siblings(".dropdown").removeClass("selected");
    $(this).toggleClass("selected");
});

问题是当我点击子菜单中的一个孩子时，我现在的方式是切换菜单并关闭它。

单击文档中的其他任何位置时，我还想隐藏菜单。这可以通过以下方式完成：

$(document).on("click", function(event) {
    $("#menu .dropdown").removeClass("selected");
});

1）如何在单击下拉部分时启用此切换功能而不隐藏菜单？

2）单击文档上除菜单/子菜单本身以外的任何其他位置时，如何隐藏菜单？

4

1 回答 1

3

您似乎以可接受的方式回答＃2。要做#1：

$('.submenu').click(function(e) {
    e.stopPropagation();
});​

jsFiddle 示例

于 2012-12-17T22:20:16.860 回答