在Ajax div刷新之后,Jquery Masonry相互加载

我正在使用ajax刷新包含图像的div.我最初使用砌体来添加布局.

然后ajax调用返回一个使用html()方法刷新div的js.现在它完成后我正在调用masonry(‘reloadItems’).但是砌筑将所有图像加载到另一个上.页面调整大小后,它的工作原理.我尝试手动触发页面调整大小,但它不会使砌体进行调整.

JS：

$('#timerange-select,#category_select').bind('change',function() {
    form=$('#images-filter-form');
    $.get(form.action,form.serialize(),function(){
      var $container = $('#images_container');
      $container.imagesLoaded(function(){$container.masonry('reloadItems');});
      $(window).trigger('resize');
    },'script');
 });

好的,这个ajax请求的响应是：

$('#images_container').html('<%= escape_javascript(render("shared/random_issues")) %>');

所以我没有附加图片.我要更换容器是准确的.

这实际上是相互加载的10个图像.

编辑：请参阅https://stackoverflow.com/questions/17697223/masonry-images-overlapping-above-each-other/17697495?noredirect=1#17697495获取css和html.

解决方法

好吧,我好像已经解决了这个问题.

我使用以下方法获得了砌体对象：

var masonry = $('#issue_container').data('masonry');

现在使用这个方法我调用reloadItems()然后调用layout().在第一个方法调用之后,每个项目在一个tile中相互重叠,然后在调用layout()之后形成一个漂亮的砌体布局.从左上角移动到漂亮布局的动画也很不错：D.