Question

我在mousedown元素上有一个img事件处理程序：

$('#some_image').bind({
    mousedown: function(e) {
        var img = e.target;
        var relpos = ???;
    }
  })

如何获取mousedown 相对于 img的位置？相对的，也就是img个角落中的任何一个角落，以最简单的角度为准。

FWIW，我正在使用jQuery。

（抱歉这个愚蠢的问题。我想这个答案一定是微不足道的，但我找不到它，这让我疯了......）

编辑：好的，这是答案：

$('#some_image').bind({
    mousedown: function(e) {
        var offset = $(this).offset();
        var relpos = [e.pageX - offset.left, e.pageY - offset.top];
        // etc.
    }
  })

实际上，我发现对于我正在做的事情，最好减去Math.round(offset.left)和Math.round(offset.top)而不是原始偏移，因为后者并不总是整数（如图）。

BTW，至少根据Firebug，事件的offsetX和offsetY未定义，layerX和layerY甚至没有在其成员中列出。

Answer 1

我从这篇文章得到了答案jQuery get mouse position within an element

$("#something").click(function(e){
   var parentOffset = $(this).parent().offset(); 
   //or $(this).offset(); if you really just want the current element's offset
   var relX = e.pageX - parentOffset.left;
   var relY = e.pageY - parentOffset.top;
});

Answer 2

我猜你可以使用layerX和layerY。

$('#some_image').bind({
    mousedown: function(e) {
        var img = e.target;
        console.log(e.layerX+","+ e.layerY);
    }
});

Answer 3

jQuery的事件对象具有pageX和pageY属性，它们返回鼠标指针相对于文档左边缘的位置。

因此，您只需要在点击事件上获得该位置并与目标元素的位置进行比较。

官方jQuery文档提供了关于Mouse position跟踪的很好的示例。

如何获得相对于img目标元素的mousedown偏移量？

3 个答案: