javascript - jQuery .append() 弄乱了定位

Question

我正在尝试创建一个网页，用户可以在其中添加对象并使用 jQuery-UI 拖动它们。用于添加对象(可以是图像或文本)的代码可以这样总结:

function createObject($inner) {
    var $newObject = $("<div></div>").append($inner)
    .attr(/* some attributes */)
    .css(/* some css (which makes the position relative) */)
    .appendTo($father);
}

当我创建第一个对象时，没有任何问题。但是，每个后续对象都使用前一个对象的末尾作为 (0;0) 坐标，如下所示:

+----------++----------+
| object A || object B |
+----------++----------+

对象 B 的坐标现在是 (0;0)，即使它显然不在左上角。有人知道为什么会这样吗？

Answer 1

你必须使用 CSS position 属性是绝对的

https://www.w3schools.com/cssref/pr_class_position.asp

position:absolute;

此外，您必须确保您所指的 $father 始终相同。

这可以通过使用 position:absolute 创建一个 div/container block 并将所有新添加的元素添加到该 block 中来完成。