2

我找到了这个无限滚动脚本。它有效，但我不明白这一行：

'contentData': {}, // you can pass the children().size() to know where is the pagination

当我将其更改为以下内容时：

'contentData': {xyz:($('#content').children().size())},

每次的值都是一样的。在我的示例中，当我alert(($('#content').children().size()))在该afterLoad部分中调用时，该值是正确的（在每个滚动事件上都不同）。我不明白如何设置contentData为不同的值（比如第一次加载时为 10，第二次加载时为 20，等等）。

这是我的脚本：

$(function(){
    $('#content').scrollPagination({
        'contentPage': '/democontent.php', // the page where you are searching for results
        'contentData': {xyz:($('#content').children().size())}, // you can pass the children().size() to know where is the pagination
        'scrollTarget': $(window), // who gonna scroll? in this example, the full window
        'heightOffset': 10, // how many pixels before reaching end of the page would loading start? positives numbers only please
        'beforeLoad': function(){ // before load, some function, maybe display a preloader div
            $('#loading').fadeIn(); 
        },

        'afterLoad': function(elementsLoaded){ // after loading, some function to animate results and hide a preloader div
            $('#loading').fadeOut();
            var i = 0;
            $(elementsLoaded).fadeInWithDelay();
            alert(($('#content').children().size()));

            if ($('#content').children().size() > 10000){ // if more than 100 results loaded stop pagination (only for test)
                $('#nomoreresults').fadeIn();
                $('#content').stopScrollPagination();
            }
        }
    });

    // code for fade in element by element with delay
    $.fn.fadeInWithDelay = function(){
        var delay = 0;
        return this.each(function(){
            $(this).delay(delay).animate({opacity:1}, 200);
            delay += 100;
        });
    };
});
4

2 回答 2

4

我刚刚使用了这段代码并且遇到了同样的问题。然后我在我们使用的 .js 文件中寻找答案：scrollpagination.js

在此定义了一些 jQuery 函数。第一个是：

$.fn.scrollPagination.loadContent = function(obj, opts){...}

这是每次滚动足够底部时调用我们的页面（目标）的页面。事实上，它只定义了一次，所以如果你给出像 $("#targetDiv").children().size() 这样的参数，它会接受一次，并且每次都将第一个值放入目标中。

这个想法是传递一个参数，该参数将在 javascript（这里是 jQuery）中使用来更新值：一个函数；

基本上你只需要这样做：

'contentData': {xyz:function() {return $('#content').children().size()}},

每次使用该函数时，它都会计算返回值。

希望这会有所帮助，请原谅我糟糕的英语。

于 2011-12-20T20:21:53.557 回答
1

如果您想跟踪脚本正在执行的加载次数。尝试这个：

$(function(){
    var loads = 0;
    $('#content').scrollPagination({
        'contentPage': '/democontent.php?loads='+loads, // the page where you are searching for results
        'contentData': {}, // you can pass the children().size() to know where is the pagination
        'scrollTarget': $(window), // who gonna scroll? in this example, the full window
        'heightOffset': 10, // how many pixels before reaching end of the page would loading start? positives numbers only please
        'beforeLoad': function(){ // before load, some function, maybe display a preloader div
            $('#loading').fadeIn(); 
        },

        'afterLoad': function(elementsLoaded){ // after loading, some function to animate results and hide a preloader div
             $('#loading').fadeOut();
             var i = 0;
             loads++;
             alert('Number of loads is now: '+loads);
             $(elementsLoaded).fadeInWithDelay();
                alert(($('#content').children().size()));
             if ($('#content').children().size() > 10000){ // if more than 100 results loaded stop pagination (only for test)
                $('#nomoreresults').fadeIn();
                $('#content').stopScrollPagination();
             }
        }
    });

    // code for fade in element by element with delay
    $.fn.fadeInWithDelay = function(){
        var delay = 0;
        return this.each(function(){
            $(this).delay(delay).animate({opacity:1}, 200);
            delay += 100;
        });
    };

});
</script>
于 2011-11-16T11:46:06.670 回答