WEB前端

jquery监听滑动到底部自动加载下一页内容

位置:首页 > WEB前端 > jquery教程,2019-08-04 20:44
一个H5页面有列表数据,不考虑一次加载所有数据,故需要分页操作,解决方案为滑动到底部自动加载下一页内容。直接在H5的js当中实现。主要使用jquery的scro

一个H5页面有列表数据,不考虑一次加载所有数据,故需要分页操作,解决方案为滑动到底部自动加载下一页内容。直接在H5的js当中实现。

主要使用jquery的scroll()方法:

当用户滚动指定的元素时,会发生 scroll 事件。

scroll 事件适用于所有可滚动的元素和 window 对象(浏览器窗口)。

scroll() 方法触发 scroll 事件,或规定当发生 scroll 事件时运行的函数。

代码如下:

$(window).scroll(function(){
  //判断是否滑动到页面底部
     if($(window).scrollTop()== $(document).height() - $(window).height()){
           // TODO 滑动到底部时可请求下一页的数据并加载,加载可使用append方法 }
});

TAGS:滑动到底部自动加载

猜你喜欢

NewHot