JQuery - 检测哪个div框被点击

Question

我试图检测哪个div框被点击了JQuery，我不知道我做错了什么。我知道，如果单击div框，可以通过直接调用函数以不同的方法处理此问题，但我希望通过首先确定点击的方式来完成此操作。

$(document).ready(function() { 
    $(document).click(function(event){ 
     var id = event.target.id; //looks for the id of what was clicked 
     if (id != "myDivBox"){ 
      callAFunction(); 
     } else { 
      callSomeOtherFunction(); 
     } 
    }); 
}); 

谢谢你的任何建议！

Answer 1

不管你点击一下，你将永远知道被点击的元素：

$("#myDiv").click(function(e){ 
    alert("I was pressed by " + e.target.id); 
}); 

知道你不想把它添加到每一个DIV，你有你的点击您的文档，你需要弄清楚什么div可以报告为“点击”。

为了做到这一点，你就会要么需要在你的DOM元素的严格的等级制度（这是anoyingly坏的），或者你可以装饰“点击”分区与一个特定的类。

小提琴 - 与以下类似。 https://jsfiddle.net/us6968Ld/

我会用最接近的jquery来得到你想要的结果。

$(document).ready(function() { 
 
    $(document).click(function(event){ 
 
    \t var id = event.target.id; 
 
     var clickDiv = $(event.target).closest('div[class="clickable"]'); 
 
     alert(clickDiv[0].id); 
 
    
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
 
<div class="clickable" id="clickable1"> 
 
<span id="foo"> click me - Foo - clickable 1</span> 
 
</div> 
 
<div id="notClickable1"> 
 
    <div class="clickable" id="clickable2"> 
 
    <span id="span1"> 
 
     Click Me Inside Span 1 - clickable 2 
 
    </span> 
 
    </div> 
 
    <div class="clickable" id="clickable3"> 
 
    <div id="notClickable2"> 
 
     <div id="notClickable3"> 
 
     <span id="click me">Click Me - clickable 3</span> 
 
     </div> 
 
    </div> 
 
    
 
    </div> 
 

 
</div>

Answer 2

您可以使用closest函数来获取与标签div始祖元素，看下面的例子：

$(document).ready(function() { 
 
    $(document).click(function(event){ 
 
     var parentDiv = $(event.target).closest("div"); 
 
     console.log(parentDiv.prop("id")); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="div1"> 
 
    <span id="span1">Test1</span> 
 
</div> 
 
<div id="div2"> 
 
    <span id="span2">Test2</span> 
 
</div>

我希望它能帮助您。再见。

Answer 3

试试这个：

$('div').click(function() { 
    alert($(this).attr('id')); 
}); 

https://jsfiddle.net/1ct0kv55/1/