这个无限滚动脚本发生了什么？

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

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

当我把它改成这样的东西时：

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

每次都是相同的值。 在我的例子中，当我在afterLoad部分中调用alert(($('#content').children().size()))时，该值是正确的（在每个不同的scrolllevent上）。 我不明白如何将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; }); }; }); 

Answer 1

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

在这里定义了一些jQuery函数。 首先是：

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

这是每次滚动在底部时调用我们的页面（目标）的那个。 事实上，这只定义了一次，所以如果你给出像$（“＃targetDiv”）。children（）。size（）这样的参数，它将需要一次，并且每次都将第一个值放在目标中。

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

基本上你只需要这样做：

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

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

希望这有帮助，原谅请原谅我可怜的英语。

Answer 2

如果要跟踪脚本正在执行的加载量。 试试这个：

 $(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; }); }; });