JQuery - offset（）/ position（）的回调

Question

我有一个包含列表元素的div ，它具有静态定位和我想要的每个元素

1. 使用offset()方法记录其绝对定位
2. 将其定位更改为absolute ，将其移动到其他位置，然后使用记录的坐标将其移回原始位置

首先我尝试了这个：

var positions = {};
myDiv.children().each(function(){
    var child = $(this);
    var id = child.attr('id');
    var offset = child.offset();
    positions[id] = [offset.left, offset.top];

    child .css('position', 'absolute');
    var x = ...;
    var y = ...;
    child.css('left', x);
    child.css('top', y);
});

console.log(positions);

在这种情况下，“位置”对象的每个条目具有相同的坐标（第一个元素的值）。 但是，如果我注释掉移动元素的位，则positions对象具有每个子元素的正确坐标。

所以我猜这是一个同步问题，因为在offset函数终止之前调用了css函数。

所以我真正需要的是确保块child.css('left', x); child.css('top', y); child.css('left', x); child.css('top', y); 仅在'offset'功能完成时执行。

我尝试过类似的东西

$.queue(child, 'foo', function() {
        var offset = $(this).offset();
        positions[id] = [offset.left, offset.top];
        jQuery.dequeue(this);
    });
$.dequeue(child, 'foo');
child.promise().done(function() {
        child.css('position', 'absolute');
        ...
    });

但没有运气：当我记录positions对象时，它仍然有错误的坐标。

我是JS和JQuery的新手，所以我很确定如何在这里做正确的事情。

我怎样才能确定块child.css('left', x); child.css('top', y); child.css('left', x); child.css('top', y); 只有在'position'对象填充了正确的偏移坐标后才会执行？

编辑我刚刚意识到在我的情况下我需要使用'position（）'而不是'offset（）'但这并没有真正改变我所描述的问题

Answer 1

在.each()改变兄弟元素的位置可能导致在第一个之后得到错误的坐标。

为什么不在变更之前获得并存储所有职位？ 我的意思是你应该重复儿童两次。

1. 迭代孩子和商店的位置，不要改变任何CSS，
2. 再次迭代孩子并改变css。