我有一些HTML菜单，当用户单击这些菜单的头部时，我会完全显示这些菜单。当用户在菜单区域外单击时，我希望隐藏这些元素。
jQuery是否可以实现这样的功能？
$("#menuscontainer").clickOutsideThisElement(function() {
// Hide the menus
});
当前回答
我只是想让@Pistos的回答更加明显，因为它隐藏在评论中。
这个解决方案非常适合我
var elementToToggle = $('.some-element');
$(document).click( function(event) {
if( $(event.target).closest(elementToToggle).length === 0 ) {
elementToToggle.hide();
}
});
在CoffeeScript中：
elementToToggle = $('.some-element')
$(document).click (event) ->
if $(event.target).closest(elementToToggle).length == 0
elementToToggle.hide()
其他回答
使用not（）：
$("#id").not().click(function() {
alert('Clicked other that #id');
});
现在有一个插件：外部事件（博客文章）
当clickoutside处理程序（WLOG）绑定到元素时，会发生以下情况：
元素被添加到一个数组中，该数组包含所有具有clickoutside处理程序的元素（名称空间）单击处理程序绑定到文档（如果尚未存在）在文档中的任何单击时，都会为该数组中不等于或不是单击事件目标的父级的元素触发单击外部事件此外，clickoutside事件的event.target设置为用户单击的元素（因此您甚至可以知道用户单击了什么，而不仅仅是他在外面单击了什么）
因此，不会阻止任何事件的传播，并且可以在元素的“上方”使用额外的单击处理程序和外部处理程序。
我只是想让@Pistos的回答更加明显，因为它隐藏在评论中。
这个解决方案非常适合我
var elementToToggle = $('.some-element');
$(document).click( function(event) {
if( $(event.target).closest(elementToToggle).length === 0 ) {
elementToToggle.hide();
}
});
在CoffeeScript中：
elementToToggle = $('.some-element')
$(document).click (event) ->
if $(event.target).closest(elementToToggle).length == 0
elementToToggle.hide()
标准HTML：
用＜标签＞包围菜单并获取焦点状态更改。
http://jsfiddle.net/bK3gL/
另外：您可以通过Tab展开菜单。
$(document).click(function() {
$(".overlay-window").hide();
});
$(".overlay-window").click(function() {
return false;
});
如果单击文档，则隐藏给定元素，除非单击同一元素。
