1

我有一个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对象具有每个子对象的正确坐标。

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

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

我尝试过类似的事情

$.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);仅在“位置”对象填充了正确的偏移坐标后才执行块？

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

4

1 回答 1

3

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

为什么不在更改之前获取并存储所有位置？我的意思是你应该迭代孩子的两倍。

  1. 迭代childrens并存储位置，不改变任何css，
  2. 再次迭代children并更改css。
于 2013-05-16T13:40:09.320 回答