单击时隐藏下拉菜单项？

Question

我的项目有一个 fiddle。我正在使用下拉菜单进行响应式导航。我目前将下拉项目设置为在您单击它们时切换。但是，如果您在远离它的任何地方单击，我希望下拉菜单能够关闭。

我尝试从类似的问题中复制代码，但它对我不起作用。我将其包含在 fiddle 中，但注释掉了，以便您可以看到下拉菜单的工作。

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

$(".nav-dropdown").click(function(e){
  e.stopPropagation();
}); 

Answer 1

只需将 e.stopPropagation() 放入切换功能即可。

这是工作 fiddle：http://codepen.io/anon/pen/MwLoKE

（如果您只想一次打开一个下拉菜单，您还必须在切换功能中关闭打开的下拉菜单。）