Question

我正在使用infinite scroll加载一些内容。我想更改已加载的每个.post的边框。我在回调函数中有一个函数，如下所示：

$('#index-container').infinitescroll({
    loading: {
        finishedMsg: " ",
        img: "http://i.imgur.com/6SXXf7L.gif",
    },
    behavior: undefined,
    binder: $(window), // used to cache the selector for the element that will be scrolling
    nextSelector: "#next-page",
    navSelector: "#footer",
    itemSelector: ".post",
    dataType: 'html',
}, function() {
    $('.post').css('border', '5px solid red'); // my function

});

然而，一旦调用，它会影响所有内容（即使内容未通过无限滚动加载）。有没有办法我只能定位新加载的内容？

Answer 1

如果一次添加一个帖子，您可以像这样识别新帖子

$('.post').last().css('border', '5px solid red');

Answer 2

我想我找到了解决方案。数据通过回调中的参数传递，如下所示：

$('#index-container').infinitescroll({
    loading: {
        img: "http://i.imgur.com/6SXXf7L.gif",
    },
    nextSelector: "#next-page",
    navSelector: "#footer",
    itemSelector: ".post"
}, function(data) { // 'data'
    data.find('.post').css('border', '5px solid red'); // would probably work.

});

Exampled here, when combining infinitescroll with masonry.

更改加载无限滚动的内容

2 个答案: