Javascript Wordpress中带有同位素和过滤功能的无限滚动

Javascript Wordpress中带有同位素和过滤功能的无限滚动,javascript,wordpress,jquery-masonry,infinite-scroll,jquery-isotope,Javascript,Wordpress,Jquery Masonry,Infinite Scroll,Jquery Isotope,我搜索了几乎每一个论坛,找到了几种方法,通过运行Wordpress的无限滚动过滤工作来制作一个布局。他们似乎都没有给我我想要的 此时,我已使用过滤功能使砖石布局正常工作。当我实现无限滚动时,它会在其他内容下面加载内容,这是同位素和无限滚动的一个常见问题。然而,当应用以将新加载的帖子排序到我的站点时,它会弄乱我的整个布局 我怀疑我没有在正确的位置进入附加行。这是我的js,没有。append: $(function () { var $page = $('#page') }); $(fun

我搜索了几乎每一个论坛,找到了几种方法,通过运行Wordpress的无限滚动过滤工作来制作一个布局。他们似乎都没有给我我想要的

此时,我已使用过滤功能使砖石布局正常工作。当我实现无限滚动时,它会在其他内容下面加载内容,这是同位素和无限滚动的一个常见问题。然而,当应用以将新加载的帖子排序到我的站点时,它会弄乱我的整个布局

我怀疑我没有在正确的位置进入附加行。这是我的js,没有
。append

$(function () {
    var $page = $('#page')
});

$(function () {
    var $container = $('#content'),
            filters = {},
            // get filter from hash, remove leading '#'
            filterSelector = window.location.hash.slice(1);

    $container.imagesLoaded(function () {
        // bind isotope to window resize
        $(window).smartresize(function () {
            // jQuery has issues with percentage widths
            // so we'll manually calulate it
            var colW = Math.floor($container.width() * 0.49);

            $container.isotope({
            });
            // trigger resize so isotope layout is triggered
        }).smartresize();
    });

    $('#nav a').click(function () {
        // store filter value in object
        // i.e. filters.color = 'red'
        var $this = $(this),
                name = $this.attr('data-filter-name'),
                value = $this.attr('data-filter-value'),
                isoFilters = [],
                filterName, prop;

        filters[ name ] = value;

        for (prop in filters) {
            isoFilters.push(filters[ prop ]);
        }

        var filterSelector = isoFilters.join('');

        // trigger isotope if its ready
        if ($container.data('isotope')) {
            $container.isotope({filter: filterSelector});
        }

        window.location.hash = filterSelector;

        // toggle highlight
        $this.parents('ul').find('.selected').removeClass('selected');
        $this.parent().addClass('selected');

        return false;

    });

    // if there was a filter, trigger a click on the 
    // corresponding option
    if (filterSelector) {
        var selectorClasses = filterSelector.split('.').slice(1);
        $.each(selectorClasses, function (i, selectorClass) {
            $('#nav a[data-filter-value=".' + selectorClass + '"]').click();
        });
    }

    $container.isotope({
        itemSelector: '.box',
        filter: filterSelector,
        animationOptions: {
            duration: 750,
            easing: 'linear',
            queue: false,
        }
    });
});
#nav
是我的菜单,
#content
是我的容器,
.box
是我的帖子


有人能告诉我需要在哪里插入
.added
命令吗?

added方法不适用于排序和筛选,请参阅文档;此外,出于某些原因,文档不鼓励使用带有过滤和排序的无限滚动;)请参阅作者关于将过滤/排序与无限滚动相结合的意见。他还建议在这种情况下使用插入法而不是附加法。