Jquery自定义函数未在ajax加载的内容上定位div

我编写了一个自定义函数，用于在容器中定位绝对div，计算顶部位置和高度：

$.fn.gridB = function() {
    var o = $(this); //EDITED from var o = $(this[0]);
    o.each(function() {
        var a1top = o.find('.article1').position().top;
        var a1height = o.find('.article1').height();
        var a0top = o.find('.article0').position().top;
        var a0height = o.find('.article0').height();
        var a2top = o.find('.article2').position().top;
        var a2height = o.find('.article2').height();
        var a3height = o.find('.article3').height();
        var a4height = o.find('.article4').height();
        var a5height = o.find('.article5').height();
        if (a0height > a1height + a1top) {
            $('.article3', o).css('top', a0top + a0height + 20);
        } else if (a0height < a1height + a1top) {
            $('.article3', o).css('top', a1top + a1height + 20);
        }
        $('.article4', o).css('top', a2top + a2height + 20);
        $('.article5', o).css('top', a2top + a2height + 20);
        $('.article6', o).css('top', a2top + a2height + a5height + 40);
        $('.article7', o).css('top', a2top + a2height + a5height + 40);
        var lastChildPos = o.find('div:last-child').position().top;
        var lastChildHeight = o.find('div:last-child').height();
        o.height(lastChildPos + lastChildHeight + 20);
    });
};​

有点不对劲，但我很接近。如果我放置.fours:last，在ajax成功后调用函数gridB（）时，脚本只计算div的顶部位置，忽略高度。如果我删除：last，脚本不会同时计算顶部位置和高度

有什么帮助吗

编辑：下面是一个相关HTML的示例。另一个班上的小分队

 <div id="content">
<div class="fours">
  <div class="article article0">
     <div><img src="url" /></div>
  </div>
  <div class="article article1">
     <div><img src="url" /></div>
  </div>
  <div class="article article2">
     <div><img src="url" /></div>
  </div>
  <div class="article article3">
     <div><img src="url" /></div>
  </div>
  </div>
<!-- Next ".fours" div is loaded here with ajax function -->
</div>

---

编辑2：在gridB函数中，我更改了var o=$（此[0]）行；to var o=$（这是）；并将函数调用从$（'.fours:last'）.gridB（）更改为；到$（'.fours'）.gridB（）；。它起作用了，但现在脚本将所有绝对div都放置在ajax加载的下一个集合中，并使用第一组文章的值。我认为这更接近解决方案。必须有一种方法以ajax加载的容器为目标：last不起作用。

关于上次编辑中的注释，您可以执行以下操作以引用上次添加的

：

success: function(html) {
    var $html = $(html);                       // Wrap HTML in jQuery object.
    $('a#inifiniteLoader').fadeOut('1000');
    $("#content").append($html);               // Add created object.

    $html.preloader_index();                   // Use the same object.
    $html.gridB();                             // Call gridB using the same object.

---

你能发布相关的HTML吗？嗨，胡安，我发布了HTML代码，请检查我问题的编辑。有什么建议吗？我认为仍然缺少很多信息，例如，Ajax调用返回的html是什么？

preload\u index（）

调用在做什么？您还提到，这应该适用于Ajax无限循环，但您似乎对第0到第7条有固定的类名。我看不出代码是如何用于7以外的文章的。是的，我想它看起来相当复杂。我会尽力解释一下，这对我的建议是否有帮助。从ajax返回的html是另一个具有类的div容器。四个具有相同数量的div，具有相同的类（.article0-.article7），在没有无限滚动调用的情况下进行测试和工作。Preload_index（）在文章div中包含的图像中逐渐消失，我尝试了没有它的脚本，没有冲突，div仍然定位错误。最后，除了7件物品外，没有其他物品，它们是在“.fours”容器中以7件一组的方式装载的。希望这能澄清一点？我想问题是gridB（）函数没有针对ajax加载添加的.fours容器？谢谢你的帮助。JQuery对象适用于append和preload函数，但不适用于grid函数。它仍然扰乱了加载内容的布局。还有一个更长的方法，我使用了resize插件，在内容的resize事件中为每个“.fours”放置了网格函数，现在可以正常工作了。我仍然希望网格函数只对加载的内容起作用，而不是重新计算以前的内容，但现在我将保留它。

success: function(html) {
    var $html = $(html);                       // Wrap HTML in jQuery object.
    $('a#inifiniteLoader').fadeOut('1000');
    $("#content").append($html);               // Add created object.

    $html.preloader_index();                   // Use the same object.
    $html.gridB();                             // Call gridB using the same object.