javascript - jQuery - 如何将新数据附加到充满 "position: absolute"框的 div

Question

让我们有以下 HTML 结构:

<div class="items">
  <div class="item" style="position: absolute; left: Apx; top: Bpx;">...</div>
  ...
</div>

我在这个页面上使用的也是无尽的分页，所以当我点击“加载更多”按钮时，调用了这个 JS Action :

$('.items').append(...new data covered in ".item" divs...);

数据已加载，但它们显示在 .items div 的顶部 => “旧”数据(.item div)被新的。当然，我想在以前的数据下方的 .item div 中再次显示新数据(使用 position: absolute;)，但该怎么做？

谢谢

Answer 1

由于您是动态附加新的 div，因此您可以动态设置它们的顶部偏移量，如下所示:

var topValue = $('.items').position().top + $('.items').outerHeight(true) + 'px';
var newDiv = ... // Populate your new div, setting the "top: Bpx" value to topValue
$('.items').append(newDiv);