jquery文档正文单击事件

有人可以帮我吗？ ：

我有一个按钮，当点击它显示一个特定的div。 这个div有几个后代。 现在，我想要的是当我点击文档中的其他位置时， 但不会在任何后代中单击此div消失。 我认为使用not选择器是这样的：

$("#button").click(function(){ $("#mydiv").show(); $(document.body).not($("#mydiv").children()).one('click',function(e) { $("#mydiv").hide(); }); return false; }); 

但这不起作用！ 知道为什么吗？ 谢谢

Answer 1

如何检查点击事件以查看点击的内容？ 具体来看看event.target 。

 $(document).click(function(event) { var target = $(event.target); if (!target.attr('id').match(/^mydiv/) && target.parents('#mydiv').length == 0) { $('#mydiv').hide(); } }); 

我之前使用过这段代码来关闭一个打开的窗口，当有人点击窗口以外的任何地方时。

Answer 2

使用最接近检查目标是否为mydiv的后代。

 $("#button").click(function(){ $("#mydiv").show(); $(document.body).click(function() { if ($(event.target).closest("#mydiv").length == 0) $("#mydiv").hide(); }); return false; }); 

您不能使用one()因为如果您在mydiv单击，事件将被删除。 如果要删除它，则必须执行一些自定义事件解除绑定。

Answer 3

问题可能在于您传递给要排除的.not()

 .not($("#mydiv").children()) 

在您传递jQuery对象的那一刻，但是从文档中传递的内容.not()应该是字符串选择器，DOM元素或DOM元素数组。 因此，只需将jQuery对象转换为元素数组即可

 $("#button").click(function(){ var myDiv = $("#mydiv").show(); $(document.body).not(myDiv.children().get()).one('click',function(e) { myDiv.hide(); }); return false; });