关闭点击任意位置

我有以下脚本几乎完美的工作：

http://jsfiddle.net/oshirowanen/uUAqe/

我只需要它有一个附加function，任何下拉列表都会自动关闭，无论用户点击的页面在哪里，无论是在页面的空白部分，在按钮上，在文本框中等等。

Answer 1

请在此处查看更新的jsFiddle页面： http ： //jsfiddle.net/KYqyU/

要解释所做的事情，首先，将click事件绑定到将隐藏导航下拉列表的文档。

$(document).click(function() { $('.dropdown').hide(); $('.navigation').removeClass("active"); }); 

然后，您修改.navigation类上的click事件以return false ，这将阻止文档事件传播并隐藏此实例中的导航。

 $('.navigation').click(function() { $(this).siblings('.navigation.active').click(); $(this).toggleClass('active').next().toggle(); return false; }); 

正如Mark所指出的，您可以使用event.StopPropagation()来停止传播。 如果使用此方法，则需要将event作为参数/参数传递给单击回调函数。

Answer 2

试试这个来隐藏导航……

 $('.navigation').click(function(event) { $(this).siblings('.navigation.active').click(); $(this).toggleClass('active').next().toggle(); event.stopPropagation(); }); $(document).click(function(event) { $('.navigation.active').click(); $('.navigation').removeClass("active"); }); 

这使用event.StopPropagation（）来阻止任何事件冒泡dom。 因为.navigation不是单击的元素， .navigation我们只触发隐藏的内容。

关于jsfiddle的例子 。