2013-09-26 51 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 

}