如何在click事件中隐藏元素之外的任何位置？
如何在click事件中隐藏元素之外的任何位置？
提问于 2009-04-03 15:31:29
我想知道当单击页面上的任何位置时，这是否是隐藏可见元素的正确方式。
$(document).click(function (event) {
$('#myDIV:visible').hide();
});元素(div、span等)当单击事件发生在元素的边界内时，不应该消失。
回答 19
Stack Overflow用户
回答已采纳
发布于 2009-04-03 16:07:41
如果我理解的话，当你点击任何地方而不是div时，你想隐藏一个div，如果你在div上点击，那么它不应该关闭。你可以用下面的代码做到这一点：
$(document).click(function() {
alert("me");
});
$(".myDiv").click(function(e) {
e.stopPropagation(); // This is the preferred method.
return false; // This should not be used unless you do not want
// any click events registering inside the div
});这会将单击绑定到整个页面，但如果您单击有问题的div，它将取消单击事件。
Stack Overflow用户
发布于 2012-05-30 09:27:47
从jQuery 1.7开始，有了一种处理事件的新方法。我想我应该在这里回答，只是为了演示我可能如何以“新”的方式来做这件事。如果您还没有，我建议您阅读jQuery docs for the "on" method。
var handler = function(event){
// if the target is a descendent of container do nothing
if($(event.target).is(".container, .container *")) return;
// remove event handler from document
$(document).off("click", handler);
// dostuff
}
$(document).on("click", handler);这里我们滥用了jQuery的选择器和冒泡事件。请注意，我要确保在之后清理事件处理程序。您可以使用$('.container').one (see: docs)自动执行此行为，但因为我们需要在处理程序中执行条件，这在这里是不适用的。
Stack Overflow用户
发布于 2009-07-17 16:02:43
下面的代码示例似乎最适合我。而你可以使用'return false‘来停止对div或它的任何子级的所有事件的处理。如果希望在弹出式div (例如，弹出式登录表单)上具有控件，则需要使用event.stopPropogation()。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<a id="link" href="#">show box</a>
<div id="box" style="background: #eee; display: none">
<p>a paragraph of text</p>
<input type="file" />
</div>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
var box = $('#box');
var link = $('#link');
link.click(function() {
box.show(); return false;
});
$(document).click(function() {
box.hide();
});
box.click(function(e) {
e.stopPropagation();
});
</script>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/714471
复制相关文章
相似问题
腾讯云开发者
