jQuery 冒泡事件上相对于监听元素的 mousemove 偏移量

Question

如果我 jQuery 监听 "outer" 元素上的 mousemove 事件，offsetX 和 offsetY 值给出相对于"inner" 元素，当鼠标在该内部元素内并且事件冒泡到处理程序时。

如何始终获得相对于附加处理程序的元素的偏移量？

HTML

<div class="outer">
    <div class="inner"></div>
</div>

CSS

.outer {
    background: red;
    width: 300px;
    height: 400px;
    margin: 40px;
}

.inner {
    background: blue;
    width: 100px;
    height: 150px;
    margin: 70px;
    display: inline-block;
}

JS

$('.outer').mousemove(function(e) {
    console.log([e.offsetY, e.offsetX]);
});

更新：如果不清楚，即使在蓝色框内也请点跟随指针http://jsfiddle.net/00mo3eeu/1/

Answer 1

这是我目前的解决方案，欢迎提出任何改进建议。

function (e) {
  var y = e.pageY - $(e.currentTarget).offset().top
  var x = e.pageX - $(e.currentTarget).offset().left
  ...
}

理想情况下，这将作为事件对象的属性之一给出，但我找不到匹配的属性。

jQuery 冒泡事件上相对于监听元素的 mousemove 偏移量

jQuery mousemove offset relative to listening element on bubbled event

jquery

jquery-events