只有在元素已经显示时才需要隐藏元素

Question

我正在网站上工作，我创建了一个下拉菜单。单击＆＃34;关于我＆＃34;链接，它揭示了一些链接（传记，兴趣等）。我可以通过点击＆＃34;关于我＆＃34;来打开和关闭菜单。链接。这是我的问题：我想编写一些代码，只有点击＆＃34;关于我＆＃34;才能打开下拉菜单。链接，但可以通过单击文档上的链接或ANYWHERE ELSE来关闭（为了关闭下拉列表，必须再次单击＆＃34;关于我＆＃34;链接，这是非常烦人的）。这是我到目前为止的jQuery代码：

$(".about-me").click(function() {
    $(".dropdown-menu").toggle();
});

我尝试添加

$(document).click(function() {
    $(".dropdown-menu").hide();
});

但是因为＆＃34;关于我＆＃34;链接也是文档的一部分，这使得点击链接永远不会打开下拉菜单。非常感谢任何帮助！

Answer 1

停止链接上的click事件以传播DOM并触发对文档的单击：

$(".about-me").click(function(e) {
    e.stopPropagation();
    $(".dropdown-menu").toggle();
});