javascript - 计算图像的点击偏移量

Question

可能重复：
使用 jQuery 获取鼠标单击图像的 X/Y 坐标

我想计算图像的点击位置，可以说这将是一个例子：

如果我在某处单击它，我想在图像上显示单击区域的 X/Y 位置的警报，图像上有像素，所以它应该显示 x 像素偏移和 y 像素偏移。

这可能与Javascript有关吗？任何示例将不胜感激。

Answer 1

使用 JQuery，使用事件的 pageX 和 pageY 值减去元素的偏移量。

http://jsfiddle.net/BramVanroy/D63KS/1/

$(document).ready(function(){
    $('img').mousedown(function(e){
        var offset = {
            x: e.pageX - $(this).offset().left,
            y: e.pageY - $(this).offset().top
        }
            $('#info').html('{'+offset.x+'; '+offset.y+'}');
    });
});​

Answer 2

你可以做这样的事情来获取 x 和 y，其中 'theimage' 是你的图像的 id

$("#theimage").live("click",function(e){
e.preventDefault();
    var x = e.pageX - $(this).offset().left;
    var y = e.pageY - $(this).offset().top;


});