代码:
$(document).ready(function(){
$(window).scroll(function(){
var DocumentHeight=$(document).height() //文档总高度 移动端可选用document.body.scrollHeight
var WindowHeight =$(window).height() //可见区域高度 移动端可选用 window.screen.availHeight
var ScrollTop =$(this).scrollTop()//滚动条距离顶部的高度
if(DocumentHeight<=ScrollTop+WindowHeight){
console.log('继续加载数据')
}
});
});
思路:当文档总高度 - 可见文档的高度 <= 屏幕滚动的距离 ,即触发加载更多数据
或者是可见文档的高度 + 屏幕滚动的距离 >= 当 文档 总 高度
首先,$(window).scroll() 触发滚动条事件 ( 什么?没有用?检查是不是把html和body设置 width:100%;height:100% l )
获得滚动条距离顶部的高度 即 $(this).scrollTop()
可见文档的高度 即 $(window).height() 移动端可选用 window.screen.availHeight
文档总高度 即 $(document).height() 移动端可选用 document.body.scrollHeight