javascript - 选择器上的 Jquery 单击事件返回子作为目标

Question

我今天开始对 Jquery 失去理智，我查找了其他问题，但到目前为止没有任何效果。我有简单的 html 结构(在 for 循环中动态添加)。

<div id="cell'+i+'" class="cell emptyCell">
     <div class="handle"></div>
     <div class="content"></div>
</div>

我正在使用“on”方法将“.emptyCell”类元素的“点击事件”与自定义函数绑定(bind)。

$(document).on('click','.emptyCell', function(e){

    console.log(e.target.id);

});

但是当用户点击 .content div(emptyCell 的子元素)时，它会捕获事件，并且控制台打印“undefined”，因为 .content 元素在这里没有 ID。

这怎么可能？ .on 函数不应该只绑定(bind) .emptyCell 类的元素吗？

谢谢你的帮助

Answer 1

e.target 指的是点击发生的实际元素(它可以是 handle 或 content 元素)，如果你想引用 emptyCell 然后你可以使用 this 或 e.currentTarget

$(document).on('click','.emptyCell', function(e){
    console.log(this.id);
    console.log(e.currentTarget.id);
});

演示:Fiddle