Question

我正在尝试检测用JQuery点击了哪个div框，我不确定我做错了什么。我知道如果单击一个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

您可以使用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 2

无论您点击什么，您都会知道点击的元素：

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

知道你不想将它添加到每个div，并且你点击了你的文档，你需要弄清楚哪些div可以被报告为“点击”。

为了做到这一点，你要么在DOM中需要一个严格的元素层次结构（这是非常糟糕的），或者你可以用特定的类来装饰“可点击的”div。

小提琴 - 类似于下面。 https://jsfiddle.net/us6968Ld/

我会在Jquery中使用最接近的结果来获得你想要的结果。

$(document).ready(function() {
    $(document).click(function(event){
    	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 3

试试这个：

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

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

JQuery - 检测单击了哪个div框

3 个答案: