javascript - offsetX、offsetY 和 pageX、pageY 有什么区别？

Question

我需要一个弹出 div，它将出现在我单击的 anchor 的正下方。现在，我想确定 anchor 的 onClick 事件的 x 和 y 坐标。这样做的最佳实践是什么？建议使用哪些事件属性？

Answer 1

offsetX 和 offsetY 相对于父容器，而 pageX 和 pageY 相对于文档。不要将其与 .offset() 和 .position() 混淆，其中 .offset() 相对于文档，而 .position() 相对于父容器的 .offset()。

类似这个示例的东西应该可以工作(JQuery):

$('a').click(function(){
    var offset = $(this).offset();
    $('#popup_div').css('top',offset.top + 'px').css('left',offset.left + 'px').show();
});

http://api.jquery.com/offset/

http://api.jquery.com/position/