父类的jQuery单击事件，但find子（单击）元素

比方说，我有一个父元素，它有很多嵌套的子元素：

<div id="p"> <div id="c1"> <div id="c2"></div> <div id="c3"></div> </div id="c4"> <div id="c5"></div> </div> </div>

我已经在父级上绑定了一个click事件：

 $('#p').bind('click', function() { alert($(this).attr('id')); });

因为事件被分配给父元素，我总是看到父母的ID，但是，我想知道是否有任何可能的方法来找出哪些这些子元素已被点击？

我也不能将任何事件分配给子元素或从父div中删除事件侦听器。

你需要传递事件对象来获取触发事件的项目，event.target会给你的源元素。

现场演示

  $('#p').bind('click', function(event) { alert(event.target.id); });

要么

现场演示

 $('#p').bind('click', function(event) { alert($(event.target).attr('id')); });

编辑

为了性能，简单性和可读性，第一个方法event.target.id优于第二个$(event.target).attr('id') 。

你可以尝试下面的代码。也试试jsfiddle（演示）。

 $('#p').on('click', function(event) { alert(event.target.id); });

尝试演示

第二个问题的答案是，您可以将事件分配给孩子，并从其父母中移除。看一下这个。

 .stopPropagation();

防止事件冒泡DOM树，阻止任何父处理程序被通知事件。阅读更多

如果您只想执行特定事件并且不允许其他事件被触发，请使用以下代码

 event.stopImmediatePropagation()

保持处理程序的其余部分不被执行，并防止事件冒泡DOM树。阅读更多

我希望这会解决你的问题。如果您有任何问题，请不要犹豫，问。谢谢

如果你的分子有孙子，还有一个更好的方法来得到孩子。注意大于号。

 $('.parent > .child').click(function() { // This will be the child even if grandchild is clicked console.log($(this)); });