jquery:如果在div内部,请点击鼠标

Question

我有这个HTML页面

<html>
<body>
<div>a</div>
<div>b</div>
<div>c</div>
<div>d</div>
<div id='in_or_out'>e</div>
<div>f</div>
</body>
</html>

a,b,c,d,e和f可以是div而不仅仅是纯文本.

我想获得鼠标点击事件,但我怎么知道它是在#in_or_out div的内部还是外部？

编辑::伙计们,我知道如何检查div是否点击,但我希望我的事件在点击超出该div时被触发

Answer 1

$("body > div").click(function() {
    if ($(this).attr("id") == "in_or_out") {
        // inside
    } else {
        // not inside
    }
});

编辑:刚学会,有一个否定:

$("body > div:not(#in_or_out)").click(function(e) {
    // not inside
});

Answer 2

如果要检测是否已在div内部或外部单击,请在其上设置事件处理程序,documentElement并让它从其他元素向上传播:

$("html").click(function (e)
{
    if (e.target == document.getElementById("in_or_out"))
        alert("In");
    else
        alert("Out!");
});

Answer 3

也许这个会帮助你

$('body').click(function(){
    //do smth
});
$('div#in_or_out').click(function(e){
    e.stopPropagation();
    // do smth else
});

Answer 4

取决于你想要什么。如果你只想执行代码，当它在inside #in_or_out时，你可以这样做：

$('#in_or_out').click(function(){ /* your code here */ });

您可以有一个状态变量来指示鼠标是否处于状态#in_or_out：

var inside = false;

$('#in_or_out').hover(function() { inside = true; }, function() { inside = false; });

然后，每当发生点击时，您都可以检查inside点击是否在内部in_or_out。

更新：

无论将click处理程序绑定到哪个元素，您始终可以执行以下操作：

$('element').click(function() {
     if ($(this).attr('id') !== 'in_or_not') {

     }
 });