jQuery ScrollPagination滚动时会重复加载数据，求解决办法 ？

Question

把scrollpagination.js文件打开, 修改它的源码, 主要是这个地方在不断触发  $.fn.scrollPagination.loadContent = function(obj, opts){
 var target = opts.scrollTarget;
 var mayLoadContent = $(target).scrollTop()+opts.heightOffset >= $(document).height() - $(target).height();
 if (mayLoadContent){
 if (opts.beforeLoad != null){
opts.beforeLoad(); 
 }
 $(obj).children().attr('rel', 'loaded');
 $.ajax({
  type: 'POST',
  url: opts.contentPage,
  data: opts.contentData,
  success: function(data){
$(obj).append(data); 
var objectsRendered = $(obj).children('[rel!=loaded]');

if (opts.afterLoad != null){
opts.afterLoad(objectsRendered);
}
  },
  dataType: 'html'
 });
 }
 
  };新建 var loading = false;  $.fn.scrollPagination.loadContent = function(obj, opts){
if(loading)return;//here
 var target = opts.scrollTarget;
 var mayLoadContent = $(target).scrollTop()+opts.heightOffset >= $(document).height() - $(target).height();
 if (mayLoadContent){
 if (opts.beforeLoad != null){
opts.beforeLoad(); 
 }
 $(obj).children().attr('rel', 'loaded');
 $.ajax({
  type: 'POST',
  url: opts.contentPage,
  data: opts.contentData,
  success: function(data){
loading = false;//here
$(obj).append(data); 
var objectsRendered = $(obj).children('[rel!=loaded]');

if (opts.afterLoad != null){
opts.afterLoad(objectsRendered);
}
  },
  dataType: 'html'
 });
 }
 
  };

Answer 1

人家可能写错了，你看下修正下就行了；把第二行的:
if(loading)return;
改为
if(!loading)return;
就ok！

Answer 2

'afterLoad': function(elementsLoaded){ // after loading content, you can use this function to animate your new elements
//elementsLoaded 本次加载的一个 jquery封装的dom 对象
                          if(.....自己写判断条件)｛
                                 $(xxxxx).stopScrollPagination();  //停止加载
                        ｝
}作者已经提供了你机会 当一次加载完后的回调  你自己来判断是否 停止加载给你个例子$(function(){
    var i = 0;
$('#content').scrollPagination({
'contentPage': 'test.html', // the url you are fetching the results
'contentData': {}, // 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();
},
'afterLoad': function(elementsLoaded){ // after loading content, you can use this function to animate your new elements
 $('#loading').fadeOut();
            //this.contentPage = '';
            elementsLoaded.html(i++);
            if(i>10){
                $('#content').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;
});
};
   
});

Answer 3

应该是if(!loading)return;   或者你把false改成true