Question

我正在使用packery以砖石格式安排博文。这适用于最初显示在页面上的帖子，但是当我加载新帖子时 - 当点击分页链接时 - 通过AJAX，帖子只会被添加到容器中但不会重新包装＆＃39;或以砖石形式重新安排。

我正在使用WordPress并使用我自己的AJAX调用，请参阅以下代码：

// For jQuery noConflict
(function($)    {

    $(document).ready(function() {

        // Find out the page number
        var pageNumber;
        $('.custom-pagination a.page-numbers').click(function() {
            pageNumber = $(this).html();
        });

        // AJAX call to load more posts when pagination links are clicked
        $(document).on( 'click', '.custom-pagination a.page-numbers', function( event ) {
            event.preventDefault();
            page = pageNumber;
            $.ajax({
                url: ajaxpagination.ajaxurl,
                type: 'post',
                data: {
                    action: 'ajax_pagination',
                    query_vars: ajaxpagination.query_vars,
                    page: page
                },
                success: function( html ) {

                    var $container = $('#all-posts').packery();

                    $container.append( html );
                    $container.packery( 'appended', html );

                }
            });
        });

    });

})(jQuery);
// End jQuery noConflict

在通过AJAX加载后，有没有人能指出我如何再次调用打包以重新排列我的帖子？

感谢。

Answer 1

我有同样的问题，并根据the instructions here照顾服务器端（web2py / python）：

# this function is called via ajax
def function_that_loads_the_new_content():
   ...
   new_divs = #generate new content
   new_divs_as_string = ''.join([str(x) for x in new_divs])
   # this script runs when the new content is appended to the container
   update_results = \
       "var $items = $('%s');$pack.append($items).packery( 'appended', $items );" \
        % new_divs_as_string
   return update_results

这个想法是在将新元素添加到容器元素之后使用packery的附加功能。上述脚本基本上等同于打包页面中提供的此模板：

$('.append-button').on( 'click', function() {
  // create new item elements
  var $items = $('<div class="grid-item">...</div>');
  // append items to grid
  $grid.append( $items )
    // add and lay out newly appended items
    .packery( 'appended', $items );
});

Packery在通过AJAX加载时没有安排额外的div

1 个答案: