当用户点击外部时，使用jQuery隐藏div
我很想用它，因为它看起来有很好的评价，但我不确定它到底能做什么。有人能解释一下吗？我知道.has()返回具有给定子级的元素，但函数是如何处理的？
这是另一个问题答案的代码：
$(document).mouseup(function (e)
{
var container = $("YOUR CONTAINER SELECTOR");
if (container.has(e.target).length === 0)
{
container.hide();
}
});
首先你需要知道的是浏览器中的事件是如何工作的。在大多数情况下，它们从最初触发事件的元素一直"冒泡"到它的祖先元素，再到文档本身；这个过程称为事件传播。
所以，如果你有这个HTML:
<body>
<div>
<a href="#">Click me!</a>
</div>
</body>
然后单击<a>元素，该事件将由该<a>元素触发，但气泡到<div>，然后到<body>，再到<document>。
如果您将事件处理程序绑定到document，那么单击锚点仍然会触发该事件处理程序函数，因为事件会冒泡，最终由文档处理。这就是上面代码的基本原理。
现在，让我们来看看实际的事件处理程序函数。您只有一个参数e，它就是事件本身。该对象有一个属性target，它是最初触发事件的元素。
回到我们的简单HTML示例，如果您单击<a>元素，那么e.target将是锚，即使在文档级别处理事件时也是如此。这与jQuery事件处理程序函数中的this不同，后者将是处理事件的元素（在本例中为document）。
第一行非常直接——它只是选择了要忽略点击的元素。
if语句有点棘手，但它本质上是在说"如果最初触发此事件的元素不是我们容器的后代，那么隐藏我们的容器"。
container.has(e.target)部分检查"触发事件的元素在我们的容器中吗？"。如果答案是"是"，那么length属性将大于0（确切地说，它将是1，因为我们从包含单个元素的jQuery对象开始）。
如果答案是"否"，则length属性将等于0。由于这是我们实际想要检查的内容，我们将length属性与if条件中的0进行比较。
查看此代码：
if ($(".myClass").length === 0){
//Do stuff
}
这将检查返回的jQuery对象是否包含任何元素。.length将返回元素的数量。因此，如果对象是否为空，检查长度是否等于0将给我们一个布尔值。
类似地，您可以执行以下操作来执行相反的
if ($(".myClass").length > 0){
//Do stuff
}
此外，由于大于0的数字将计算为true，0将计算为false，因此您可以将其简化为：
if ($(".myClass").length){
//Contains elements
}else{
//No elements
}