jQuery实现当拉动滚动条到底部加载数据

最新推荐文章于 2024-05-16 23:39:45 发布

小向光

最新推荐文章于 2024-05-16 23:39:45 发布

阅读量4.4k

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/wuyou1336/article/details/56035560

版权

本文介绍了如何利用jQuery实现滚动到底部加载数据的原理和方法，涉及到滚动事件监听、滚动位置判断以及浏览器兼容性处理，特别是针对Chrome、Firefox和IE中不同浏览器对滚动条的理解差异进行了解析。

摘要由CSDN通过智能技术生成

滚动条到底部加载数据原理很简单，就是为window或者滚动元素添加一个scroll事件，浏览器每次触发scroll事件时判断是否滚动到了浏览器底部，

如果到了底部则加载新数据。关键是计算滚动条是否滚动到了浏览器底部，算法如下

滚动条卷起来的高度 + 窗口高度 > 文档的总高度

	$(window).on('scroll',function(){
		if(scrollTop() + windowHeight() >= (documentHeight() - 50/*滚动响应区域高度取50px*/)){
			loadMore();
		}
	});

获取页面顶部被卷起来的高度函数

关注