Javascript 单击时切换div，单击外部时隐藏

我已经有了切换显示和隐藏div的代码，但每当我尝试在单击外部时添加隐藏时，它与切换代码冲突，我需要切换div_菜单，但在单击外部时也会隐藏它，就像facebook下拉菜单一样

$(document).ready(function() {
    $(".toggle_menu").click(function(e) {
        $(".div_menu").toggle();
        e.preventDefault();
    });
});

---

使用e.target查找当前目标元素，并使用对照选择器检查当前匹配的元素集

$(document).ready(function () {
    $(document).click(function (e) {
        if ($(e.target).closest(".toggle_menu,.div_menu").length) {
            $(".div_menu").toggle();
            e.preventDefault();
        } else {
            $(".div_menu").hide();
        }

    });
});

---

使用e.target查找当前目标元素，并使用对照选择器检查当前匹配的元素集

$(document).ready(function () {
    $(document).click(function (e) {
        if ($(e.target).closest(".toggle_menu,.div_menu").length) {
            $(".div_menu").toggle();
            e.preventDefault();
        } else {
            $(".div_menu").hide();
        }

    });
});

试试这个

$(document).click(function(e){
    if($(e.target).parents('.div_menu').length == 0 && $(e.target).attr('class') != "div_menu"){
        $(".div_menu").toggle();
    }
});

试试这个

$(document).click(function(e){
    if($(e.target).parents('.div_menu').length == 0 && $(e.target).attr('class') != "div_menu"){
        $(".div_menu").toggle();
    }
});

---

你可以这样做

$（文档）.ready（函数（）{
$（“.toggle_menu”）。单击（函数（e）{
$（“.div_菜单”）.toggle（）；
e、 预防默认值（）；
});
$（文档）。单击（函数（e）{
if（！$（e.target）.closest（'.toggle_menu，.div_menu'）.length）{
$（“.div_菜单”）.hide（）；
}
})
});

切换菜单
一些随机内容菜单
这里还有一些其他内容
您可以执行以下操作


$（文档）.ready（函数（）{
$（“.toggle_menu”）。单击（函数（e）{
$（“.div_菜单”）.toggle（）；
e、 预防默认值（）；
});
$（文档）。单击（函数（e）{
if（！$（e.target）.closest（'.toggle_menu，.div_menu'）.length）{
$（“.div_菜单”）.hide（）；
}
})
});

切换菜单
一些随机内容菜单
此处还有一些其他内容
将单击事件分配给
文档
，并检查单击是否在
.div\u菜单
之外。如果是，则隐藏它将单击事件指定给
文档
，并检查单击是否在
.div\u菜单
之外。如果是，则隐藏它