码迷,mamicode.com
首页 > 移动开发 > 详细

手机H5页面,滑动到底部自动加载下一页内容

时间:2017-06-19 09:53:10      阅读:2532      评论:0      收藏:0      [点我收藏+]

标签:底部   doc   方案   scroll   解决   项目   bsp   style   function   

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

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

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

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

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

代码如下:

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

 

手机H5页面,滑动到底部自动加载下一页内容

标签:底部   doc   方案   scroll   解决   项目   bsp   style   function   

原文地址:http://www.cnblogs.com/mark8080/p/7047186.html

(1)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!