无限滚动加载(第一次请求完成后才发第二次请求)
var time1; var srcollOld = 0,srcollNow = 0,scrollFun = false; $(window).scroll(function () { //$(window).scrollTop()这个方法是当前滚动条滚动的距离 //$(window).height()获取当前窗体的高度 //$(document).height()获取当前文档的高度 var bot = 50; //bot是底部距离的高度 if ((bot + $(window).scrollTop() ) >= ($(document).height() - $(window).height())) { srcollNow = $(window).scrollTop(); if(srcollNow >= srcollOld){ if(!scrollFun){ //第一次请求完成后才发第二次请求 scrollFun = true; clearTimeout(time1); time1=window.setTimeout(function(){ loadAjax() },500); } } srcollOld = srcollNow; } }); function loadAjax(){ $.ajax({ url: url, type: type, success:function (data) { scrollFun = false; if (data.success == true) { }else{ } }, error: function(XMLHttpRequest, textStatus, errorThrown) { scrollFun = false; } }); }
--------------------------------------------------------------------------------------------------------------------------------------------------------
var pageNum = 5; var listHeight = $(".house-list").height(); var scrollFun = false; var time1; //获取购买数据 function getBuyData(releaseType, pageSize) { $.ajax({ url: apis + "wap/house/page/filter?releaseType=" + releaseType + "&pageSize=" + pageSize, type: "GET", dataType: "json", success: function(data) { scrollFun = false; console.log(data); if(data.code == "000000") { var buyData = data.data console.log(buyData) var html = ""; for(var i of buyData) { console.log(i) html += `<li> <a href="buyDetails.html?id=${i.id}"> <img src="img/sell-bg.jpg" alt="" class="pic-box"> <div class="house_detailed clearfloat"> <div class="detailed_lf"> <p>${"$"+countSum(i.price)}</p> </div> <div class="detailed_rt"> <div class="dobedes"> <p><em class="emorg1"></em>455sqft</p> <p><em class="emorg2"></em>4bd </p> <p><em class="emorg3"></em>4ba</p> </div> <span>${i.street}</span> </div> </div> </a> </li>`; } $(".house-list").html(html); } }, error: function(data) { scrollFun = false; } }).then(function() { //获取滚动条到顶部的垂直高度 (即网页被卷上去的高度) $(window).scroll(function() { var scrollHeight = ($(".house-list").children().length - 4) * $(".house-list li").height() - $(".search-box").height() console.log($(document).scrollTop() >= scrollHeight); if($(document).scrollTop() >= scrollHeight) { if(!scrollFun) { //第一次请求完成后才发第二次请求 scrollFun = true; clearTimeout(time1); time1 = window.setTimeout(function() { console.log(6565665) pageNum += 5 console.log(pageNum) getBuyData(2, pageNum); }, 500); } } }); }) } getBuyData(2, pageNum);