web移动端下拉加载数据简单实现

//下拉加载在移动端会经常使用，有些小伙伴不清楚一些原理下面就简答的介绍一下

//首先需要监听window的滚动事件，下拉其实就是在监听window滚动事件

var pageNum = 1;//分页第一页
var pageTotal = 0;//默认总页数

$(window).scroll(function () {
    var scrollTop = $(this).scrollTop();//这一步是计算已经卷进去滚动条的的高度
    var scrollHeight = $(document).height();//这个就算当前页面的总高度
    var windowHeight = $(this).height();//这个是当前window也就是浏览器的高度
    if (scrollTop + windowHeight == scrollHeight) {//如果这两个相等，不就意味着已经到了页面底部了吗？
        pageNum += 1;//这是一个全局的变量，页面滑到底部就加一
        next(pageNum);//完了执行你请求数据的函数
    }
});
//说明：分页是有总页数的，当超过了总页数那么久不去请求，所以你在next（）做一些处理比如:你将第一次获取的数据中有总页数的这个参数，那么你赋值给

 pageTotal ，那么以后的下拉中你可以
function next(pageNum) {
if (pageTotal != 0) {
if (pageNum > pageTotal) {
return false//当前页数大于总页数，就return
      }；
    .......
}

转载于:https://www.cnblogs.com/-youth/p/6141173.html