此效果是避免滚动到固定位置多次添加的问题
var caseStatus=true; //是否追加 var casePageNum=0; //分页页数 //评价滚动到底部追加 $(window).scroll(function () { var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop; //判断是否滚动到底部 if (scrollTop + window.innerHeight+700> document.body.offsetHeight) { //700 表示距离底部多少的距离的开始触发加载更多效果 //加载更多 if (caseStatus==true) { //防止多次加载 caseStatus=false casePageNum=casePageNum+1 caseMore(casePageNum) } } }) //加载更多方法 function caseMore(page) { $.getJSON(‘/api.php?op=six&diID={$diID}&type={$type}&pagesize=9&page=‘+page, function(data) { console.log(data) if(data!=null) { $.each(data, function (j) { i++; var titleText=data[j].title;//标题 var areaText=data[j].pm; //面积 var type1=data[j].fg; //风格 var thumb=data[j].thumb //图片 var url=data[j].url //跳转路径 var html=`<div class="institute-case-item"> <a href="${url}"> <div class="institute-case-top"><img alt="${titleText}" src="${thumb}" class="institute-case-img"></div> <div class="institute-case-con"> <p class="institute-case-title">${titleText}</p> <div class="institute-case-text"><span>${type1}</span><span>${areaText}㎡</span></div> </div> </a> </div>`; $(".institute-tab-case").append(html); caseStatus=true }); }else{ console.log("没有数据了") } }); }
原文:https://www.cnblogs.com/shanshanjiadexiaohai/p/11187435.html