首先纪律性的定义page和isLoading
var page = 0;
var isLoading = false;
// 获取商家列表
function getList(){
page++;
isLoading = true;
$.getJSON("../json/homelist.json",
(data, textStatus, jqXHR) => {
console.log("我是商家列表数据组a",data);
var list = data.data.poilist || [];
initContentList(list);
isLoading = false;
}
);
}
在函数开始加载的时候page++,同时转换isLoading,在AJAX载入完成后调转isLoading
function addEvent(){
window.addEventListener('scroll', ()=>{
var clientHeight = document.documentElement.clientHeight;
var scrollHeight = document.body.scrollHeight;
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
var prodis = 30;
if(clientHeight+scrollTop >= (scrollHeight-30)){
//最多滚动三页
if(page<3){
//在ajax请求时避免多次加载
if(isLoading){
return;
}
getList();
}
}
})
}
prodis是额外的缓冲距离,免得直接看到底部