链接事件侦听器返回的子元素

用户3459394

我可能会错过一些显而易见的东西。我最近转移到使用Vanila JS形式的Jquery,我无法破解的一件事是..

当我将eventListener添加到包含子元素的链接时,该事件将返回子元素而不是链接元素本身。

我尝试了很多不同的解决方案,并且可以停止在子元素上添加指针事件:无,但是我需要其他解决方案。

您的帮助将不胜感激

<a href="#" id="click-me" id="2">
<span class="child-span"></span>
</a>

let test  = document.getElementById('click-me')

test.addEventListener('click',function(el){
el.preventDefault()
console.log(el.target)
})

这将返回span元素,但是我正在尝试返回#click-me id

一月

单击事件的事件侦听器不将元素作为参数传递。它传递event-object作为其参数。在该事件对象内部是在target-property下触发事件的元素如果希望事件绑定到的元素,则可以使用currentTarget-property。

let testElement = document.getElementById('click-me')
testElement.addEventListener('click', function(event){
  event.preventDefault();
  console.log('Someone clicked the element!');
  console.log(event.target);
  console.log(event.currentTarget);
});
#click-me {
  background-color: #cff;
}

#click-me .child-span {
  background-color: #f99;
}
<a href="#" id="click-me" id="2">
  <span class="child-span">CLICK ME!</span>
  <span class="child-span">No, please click me!</span>
  ... or maybe me?
</a>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章