2013-09-26 38 views
1

我从GitHub获得了一段代码。它是一个Jquery滚动分页插件。jquery插件(.scrollPagination)

https://github.com/andferminiano/jquery-scroll-pagination/tree/master

JAVASCRIPT

$(function(){ 
    var count=$('#existing_campaign li').length; 
    $('#existing_campaign').scrollPagination({ 
     'contentPage': '/cs_directory/helpers/campaigns_and_chats.php', // the url you are fetching the results 
     'contentData': {"count":count}, // these are the variables you can pass to the request, for example: children().size() to know which page you are 
     'scrollTarget': $(window), // who gonna scroll? in this example, the full window 
     'heightOffset': 10, // it gonna request when scroll is 10 pixels before the page ends 
     'beforeLoad': function(){ // before load function, you can display a preloader div 
      $('#loading').fadeIn(); 
      alert($('#existing_campaign li').length); 
     }, 
     'afterLoad': function(elementsLoaded){ // after loading content, you can use this function to animate your new elements 
      $('#loading').fadeOut(); 
      var i = 0; 
      $(elementsLoaded).fadeInWithDelay(); 
      if ($('#existing_campaign li').length > 1000){ // if more than 100 results already loaded, then stop pagination (only for testing) 
       $('#nomoreresults').fadeIn(); 
       $('#existing_campaign').stopScrollPagination(); 
      } 
     } 
    }); 

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

我不知道为什么,但我一直在发送它contentPage进行处理,不管有多少次我激活后得到了我的contentData内容的相同的值该函数并从contentPage附加了我的列表。

我认为它是一个缓存问题,但我不知道如何清除缓存。尝试插入.scrollPagination作为选项,但不起作用。

不知道我该如何解决这个问题。我知道这可以做别的我将如何将我的<li>的从我的内容页面分组显示一点点?

该文档是有点缺乏其选项,所以我得到这里寻找答案。希望有人可以提供一些答案。

回答

1

我有同样的问题。 我在BeforeLoad事件中修改了这个正在变化的de内容数据,并在afterLoad事件中增加了页面,如下所示:

function initInfiniteScroll(data){ 

$('#my-div').scrollPagination({ 
    'contentPage': url, 
    'scrollTarget': $(window), 
    'heightOffset': 1, 
    'AjaxAsync': true, 
    'beforeLoad': function() { 
     $(this).attr('contentData', data); // setting the contentData 
    }, ... 
'afterLoad': function (loadedData) { 
      ... 
      data.currentPage++; //Incrementing the page 

}