Javascript JQuery将元素定位在鼠标单击位置

我有下面的脚本，它获取容器的单击区域相对于其宽度和高度（而不是页面的）的X和Y坐标

以下是单击的x和y（函数返回值）：

现在我想在单击鼠标的同时使用它的返回值来定位元素

以下是我在获得坐标后立即执行的操作：

$(this).append("<div style='width: 10px; height: 10px; background-color: red; " +
                "position: relative; left:"+ relX +"px; top: "+ relY +"px;'></div>");

$（this）.append（“”）；

将创建，并将其放置在容器中。但问题是我的位置是完全对称的。我已经改变了左，右，反之亦然，但什么都没有改变，当我从右到左改变时，我希望它能工作，但它只是太远了

以下是JSFIDLE：

改变 位置：相对位置

到 位置：绝对位置

完成此操作后，定位计算必须考虑边距和偏移。最简单的方法是使用jQuery

var handler = function (oEvent)
{
     var Element     = $(this); // get the container

     var oOffset     = Element.offset();
     var Height      = Element.outerHeight();
     var Width       = Element.outerWidth();
     var PosY        = oOffset.top  + Height - oEvent.pageY; // Not necessarily needed for this situation, but useful
     var PosX        = oOffset.left + Width  - oEvent.pageX; // Not necessarily needed for this situation, but useful
     var MarginT     = Element[0].style.marginTop  ? parseInt(Element[0].style.marginTop ) : 0;
     var MarginL     = Element[0].style.marginLeft ? parseInt(Element[0].style.marginLeft) : 0;

     if (Element[0].style)
     {
        Element[0].style.top      = (Element[0].offsetTop  - MarginT) + "px";
        Element[0].style.left     = (Element[0].offsetLeft - MarginL) + "px";
     }
}

---

*上述代码并不完全适合您的情况，但提供了调整代码所需的信息，并且提供了一个强大的示例，说明尽管容器位置或边距绝对值不起作用，但使用css属性来实现此目标的计算。.检查JSFIDLE并尝试它（欢迎使用：）我自己也遇到过类似的问题，当弹出窗口被拖动时，如何定位弹出窗口。如果这解决了您的问题，请将其标记为解决方案：D抱歉，这不是解决方案，请再次检查，我的容器现在在页面中的位置为0到0，我们认为它可以工作，但它不工作…再次检查小提琴，容器在条件更改后有一点余量：p我将更新一个更准确的答案。我只需要找到你误解的代码，我这边的标准，而不是你的。我不希望有空白或填充，因为示例中没有包括这一点。我现在正在编辑一个正确的答案

var handler = function (oEvent)
{
     var Element     = $(this); // get the container

     var oOffset     = Element.offset();
     var Height      = Element.outerHeight();
     var Width       = Element.outerWidth();
     var PosY        = oOffset.top  + Height - oEvent.pageY; // Not necessarily needed for this situation, but useful
     var PosX        = oOffset.left + Width  - oEvent.pageX; // Not necessarily needed for this situation, but useful
     var MarginT     = Element[0].style.marginTop  ? parseInt(Element[0].style.marginTop ) : 0;
     var MarginL     = Element[0].style.marginLeft ? parseInt(Element[0].style.marginLeft) : 0;

     if (Element[0].style)
     {
        Element[0].style.top      = (Element[0].offsetTop  - MarginT) + "px";
        Element[0].style.left     = (Element[0].offsetLeft - MarginL) + "px";
     }
}