使用 jquery append with masonry

Question

我正在使用这个：

$('#loadmore').click(function() {
$.ajax({
   url: 'includes/loadmorebuilds.php',
   success: function(html) {
      $("#content").append(html);
   }
});
});

将更多项目加载到使用 jquery masonry 排序的容器中。 然而，当它们被附加时，它们不会跟随其余的项目并打破砖石风格。

新项目作为砖石布局工作，但他们只是不从第一个继续。 他们从那里开始自己的线路。

我在他们的网站上搜索并找到了这些信息：

msnry.appended( elements )
// or with jQuery
$container.masonry( 'appended', elements )

我只需要帮助修改我的原始脚本以使附加的项目与砖石一起工作。

谢谢，克雷格。

Answer 1

您可以做的是将传入的 html 附加到砌体容器，然后“通知”砌体。 看看这个小提琴。 因此，在您的示例中，您的成功回调可能如下所示：

//...      
success: function(html) {
    var content = $("#content"),
        elements = $(html); 
        // would make sense to reference your masonry container through 
        // a variable used earlier in the script, but that should work too
        content.append(html).masonry('appended', elements);
}
//...

还有其他一些方法可以做到这一点，但它应该足以满足您的描述。 重要的是您传递的元素是'Type: Element, NodeList, or Array of Elements' ，因此您可能想要检查您实际收到的内容。