使用 .on 获取原始元素

Question

当使用jQuery的事件委托时，有没有办法检索调用.on的元素，以及调用事件的元素？

j查询：

$(".item").on("click","a",function() {
    var link = $(this); // a tag
    var itemDiv = // what?
});

.HTML：

<div class="item">
    <a href="#">Link</a>
    <a href="#">Link</a>
    <a href="#">Link</a>
    <a href="#">Link</a>
</div>

Answer 1

。有没有办法检索调用 .on 的元素，如 以及调用事件的元素？

如果你想知道事件附加到哪个元素，你可以使用 event.delegateTarget。

你可以像这样使用它：

$(".item").on("click", "a", function (event) {
    var link = $(this); // a tag
    var itemDiv = event.delegateTarget;
    console.log(itemDiv);
});

---

演示 - 使用 event.delegateTarget

---

我

不太确定我是否理解问题的第二部分，但如果您想找出启动事件的确切元素，您可以使用 event.target。

我不确定这是你的意思，但以防万一我在下面添加了一个例子。

您可以像这样使用它：

$(".item").on("click", "a", function (event) {
    var link = $(this); // a tag
    var initiatedBy = event.target;
    console.log(initiatedBy);
});

如果您有链接或类似链接中的span，并且需要检查单击的确切元素，这将派上用场。

如果要将事件

附加到容器，但不想触发容器中的任何事件，除非单击其中的确切元素，这也将派上用场。

---

DEMO - 检查启动事件的元素（第二个链接包含span，请参阅控制台日志中的区别）

---

Answer 2

你可以使用 .parent（） 函数....

请参阅此教程链接：

http://www.w3schools.com/jquery/traversing_parent.asp

http://coursesweb.net/jquery/jquery-parent-children-nth-child

Answer 3

试试这个：

$(".item").on("click","a",function() {
    var link = $(this); //the element on which the event was called
    var itemDiv = $(this).closest(".item"); //the element on which on was called
});