首页 > js事件冒泡和捕获问题在block和inline上的不同表现

js事件冒泡和捕获问题在block和inline上的不同表现

js绑定一个事件:

<div class="btn">
    <span class="txt">test</span>
</div>

var btn = document.querySelector('.btn');
btn.addEventListener('click', fn);

function fn(e){console.log(e)}

如果这个btn是一个block类型的按钮,则e.target指向的是btn自己,如果把btn的标签div改成a标签,则这个e.target就指向了内部的span,此时我要想充e对象上获取关于btn的信息,不可能了(不是简单的dom信息,是其他一些定位信息,比如e.layerX,e.x等等),这样一来,获取的e.layerX就不是btn真正的值了,

我的需求就是想在点击btn时,获取准确真实的x,y坐标信息


a标签设置成块级元素


btn内部的所有元素设置pointer-events:none;内部元素就不会再捕获到事件了,详细api在这:https://developer.mozilla.org/zh-CN/docs/Web/CSS/pointer-events


我觉得就是你点到了span标签吧

【热门文章】
【热门文章】