javascript - 如何获取父div内元素的距离(以像素为单位)

Question

所以我正在使用 Jquery 和纯 js 编写小型应用程序，我在 div 父级中有一个元素。这个可拖动元素(ui 小部件)可以在 div 父级中移动。我想获得确切的数量从顶部和左侧开始的像素数。

我的意思是:

我现在有以下代码，但是使用这段代码我无法从顶部和底部获得准确的像素数量，

$('#dragThis').draggable(
{
    drag: function(){
        var parentOffset =$(this).parent().offset(); 
        var offset = $(this).offset();
        var xPos = offset.left - parentOffset.left ;
        var yPos = offset.top - parentOffset.top  ;
        $('#posX').text('x: ' + xPos);
        $('#posY').text('y: ' + yPos);
    },
    containment: "#parentDiv"
});

工作示例: http://jsfiddle.net/8fbdf93m/

请帮忙。

Answer 1

您也可以尝试 $(this).css('left') 或 $(this).css('top')

更新 fiddle http://jsfiddle.net/8fbdf93m/4/