jQuery下拉菜单未关闭

我做了一个下拉菜单，第一个项目菜单，你点击子菜单出现和任何子菜单内显示/隐藏悬停/悬停关闭。我遇到的唯一问题是，我希望在单击文档上的任意位置时关闭主导航

jQuery(document).ready(function () {
        jQuery(".mainNav ul li").click(function () {
            jQuery(this).find("> ul").css({ "opacity": "1", "visibility": "visible", "top": "30px" });
            });
        jQuery(".sub-menu li").mouseover(function () {
            jQuery(this).find("> ul").css({ "opacity": "1", "visibility": "visible", "top": "30px" });
        });
        jQuery('.sub-menu li').mouseout(function () {
            jQuery(this).find("> ul").css({ "opacity": "0", "visibility": "hidden", "top": "35px"});
        });});

//the code i tried below
jQuery('document').click(function () {
        jQuery(.mainNav ul li ).find("> ul").css({ "opacity": "0", "visibility": "hidden", "top": "35px"});
    });});

    }); 

我假设这两个点击事件是冲突的，但我不太熟悉如何处理它

例如，如果我将click事件更改为“h1”元素，则该下拉列表将关闭。然后我将其更改为.container，子菜单甚至根本没有出现。

您可以使用jQuery或

：not

jQuery(document).not(".mainNav ul").click(function () {
    jQuery(".mainNav ul li").find("> ul").css({ "opacity": "0", "visibility": "hidden", "top": "35px"});
});});

选择器中缺少了一些括号，我也添加了一些括号

您还有一组额外的

}）和您的
文档
单击功能不在就绪功能内。通过删除
}，尝试将其放入ready函数中mouseout

在旁注中，如果愿意，您可以使用
$
而不是
jQuery

编辑

我使用
：not
和
打开（“单击”…
尝试完整的jQuery，如果这个片段不起作用

jQuery(document).on("click", ":not(.mainNav ul, .mainNav ul *)", function () {
    jQuery(".mainNav ul li").find("> ul").css({
        "opacity": "0",
            "visibility": "hidden",
            "top": "35px"
    });
});

您可以尝试以下方法：

jQuery(document).not('.mainNav ul').click(function () {
//-----^------^-------you have to remove quotes here.

不应该
jQuery（.mainNav ul li）
be
jQuery（'.mainNav ul li'））
啊，是的，我是徒手输入的，不是复制/粘贴的。谢谢！这对wordpress主题有什么区别吗，也许这就是为什么它不写的原因？我在哪里读到，当我使用wordpress时，我应该使用jQuery而不是$，也许那是一篇旧文章？删除引号后仍然不起作用，该死。它不应该成为di不一样，没有子菜单现在一点也没有出现，再次更新，看看它是否有用Sokay，使用JSFIDLE中的代码使其工作。仍然不知道我做错了什么哈哈。非常感谢！