jquery - 如何获取 xy 坐标但不是从窗口浏览器开始，而是从 div 开始？

Question

大家好！！

我在这里有一个问题...我在这里使用 jquery ..n 使用 Visual Studio 2008 ..我需要在将图像拖放到 div 中后找到图像的坐标。但我得到的是坐标从超出 div ..我希望它从 div 内部计数..

请问……有人吗？？

这是我的代码：

    $('#dragThis').draggable({
    cursor: 'move',        // sets the cursor apperance
    containment: '#dragThis2',
    drag: function() {
    var offset = $(this).offset();
    var xPos = Math.abs(offset.left);
    var yPos = Math.abs(offset.top);
    $('#posX').text('x: ' + xPos);
    $('#posY').text('y: ' + yPos);
    },
    stop: function(event, ui) {

    // Show dropped position.
    var Startpos = $("#dragThis").position();
    var Stoppos = $(this).position();

    $("#dragThis2").val((Stoppos.left - Startpos.left));
    var left = Math.abs(Stoppos.left);
    var top = Math.abs(Stoppos.top);
    $('#posX').text('left: ' + left);
    $('#posY').text('top: ' + top);
    }

   });

Answer 1

试试这个http://jquerypp.com/#within。此功能确实完成了任务。

Answer 2

你可以使用position()：

.position() 方法允许我们检索元素相对于偏移父元素的当前位置。

var pos = $(this).position();

Answer 3

如果#dragThis2是你的父 div 那么

var parentLeft = $("#dragThis2").position().left;
var parentTop = $("#dragThis2").position().top;

var left = Math.abs(Stoppos.left - parentLeft);
var top = Math.abs(Stoppos.top - parentTop);
$('#posX').text('left: ' + left);
$('#posY').text('top: ' + top);​

会给你left和top相对于父div#dragThis2