Javascript 如何捕捉页面正文上的点击
我有一个包含许多div的页面，当有人单击其中一个div时，它会调用一个javascript方法。如果有人单击主体，我还需要能够触发另一个方法调用，这意味着他们没有单击某个div，而是在该div之外。当我在主体标记上放置jquery click处理程序时，即使单击该div，它也会触发。有人知道如何将单击限制在div之外的任何内容吗？谢谢。您可以在整个文档上设置Javascript 如何捕捉页面正文上的点击,javascript,Javascript,我有一个包含许多div的页面，当有人单击其中一个div时，它会调用一个javascript方法。如果有人单击主体，我还需要能够触发另一个方法调用，这意味着他们没有单击某个div，而是在该div之外。当我在主体标记上放置jquery click处理程序时，即使单击该div，它也会触发。有人知道如何将单击限制在div之外的任何内容吗？谢谢。您可以在整个文档上设置onclick回调： document.onclick = function(){ alert("CLICK"); }; 另请参见
onclickdocument.onclick = function(){
alert("CLICK");
};
另请参见您需要检查单击事件的原始目标。它可以作为
e.targetevar div = document.getElementById('the-div');
document.body.onclick = function (e) {
var target = e.target;
while (target !== document.body) {
if (target === div) {
// The user clicked inside the div
return;
}
target = target.parentNode;
}
// do the stuff you want when they click outside the div here
};
您可以使整个窗口跟踪click事件，如果单击该div，它将停止事件传播
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
#wrapper {
position:absolute;
left:0px;
top:0px;
width:100%;
height:100%;
}
#antidiv {
position:absolute;
left:40px;
top:80px;
width:100px;
height:100px;
background-color:#3FF;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="antidiv"></div>
</div>
<script>
document.getElementById("antidiv").addEventListener("click", function(e) {
e.stopPropagation();
}, false);
document.body.addEventListener("click", function(e) {
alert("You didn't click the div!");
}, false);
</script>
</body>
</html>
#包装纸{
位置：绝对位置；
左：0px；
顶部：0px；
宽度：100%；
身高：100%；
}
#安蒂迪夫{
位置：绝对位置；
左：40px；
顶部：80px；
宽度：100px；
高度：100px；
背景色：#3FF；
}
document.getElementById（“antidiv”）.addEventListener（“单击”，函数（e）{
e、 停止传播（）；
}，假）；
document.body.addEventListener（“单击”，函数（e）{
警告（“您没有单击div！”）；
}，假）；
body:not（*）