JS页面滚动动态加载数据，页面下拉自动加载内容

最新推荐文章于 2024-07-16 17:26:59 发布

原创最新推荐文章于 2024-07-16 17:26:59 发布 · 3.2k 阅读

3 ·

CC 4.0 BY-SA版权

日志专栏收录该内容

434 篇文章

订阅专栏

本文介绍了一种使用jQuery实现的页面滚动动态加载数据的方法。当用户滚动到页面一半时，自动触发内容加载，增强用户体验。同时，针对不同设备，如手机和平板，提供了相应的滚动事件监听。


	//<!-- 页面滚动动态加载数据，页面下拉自动加载内容 -->
	$(window).scroll(function(){          
		totalheight =parseFloat($(window).scrollTop())+ parseFloat($(window).height());  
	  if(($(document).height()/2) <= totalheight ) {  //有滚动条 且滚动到触发点(一半)
	     next();
	  }  
	});  
	$(window).on('mousewheel', function(event) { //手机不支持
		totalheight =parseFloat($(window).scrollTop())+ parseFloat($(window).height());
		if(totalheight==$(document).height()) //无滚动条
		{
		if(event.originalEvent.wheelDelta<0) //且 向下滚动
		   		next();
		}
	});