版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u012615439/article/details/88015042
- 工具类
var Util = {
//事件节流
throttle:function(fn,delay){
var last = 0;
return function(){
var curr = +new Date();
if (curr - last > delay){
fn.apply(this, arguments);
last = curr;
}
}
},
//事件防抖
debounce:function(fn,delay){
var last;
return function(){
var ctx = this, args = arguments;
clearTimeout(last);
last = setTimeout(function(){
fn.apply(ctx, args);
}, delay)
}
}
};
- 具体实现方法
var Page = {
pageNum:0,
pageSize:10,
totalNum:0,
scrollTop:0,
bind: function () {
var resolve = Util.debounce(Page.loadData,100);//工具类初始化
$(".product").scroll(function () {
resolve();//工具类调用
});
},
loadData: function () {
var container = document.querySelector(".product");
if(container.scrollTop <= Page.scrollTop){//向上滚动不加载
return false;
}
var height = parseFloat(container.offsetHeight) + parseFloat(container.scrollTop);
var totalHeight = container.scrollHeight;
if((totalHeight - height <= 50) && (container.scrollTop > Page.scrollTop)){//滚动条距离底部小于50
Page.scrollTop = container.scrollTop;
Page.pageNum ++;
if(Page.pageNum <= Math.ceil(Page.totalNum / Page.pageSize)){
Service.getList(Page.pageNum);
}else{//没有更多数据
}
}
}
};
var Service = {
getList:function(){
$.ajax(url,params,function(data){
})
}
};