资讯专栏INFORMATION COLUMN

列表滚动到底部自动加载更多

pekonchan / 1510人阅读

摘要:列表滚动到底部自动加载更多在移动端,经常会用到列表滚动到底部,拉一下加载更多,或者点一下加载更多等等,今天我说说我的一个实现的思路。

列表滚动到底部自动加载更多

在移动端,经常会用到列表滚动到底部,拉一下加载更多,或者点一下加载更多等等,今天我说说我的一个实现的思路。
通过监听列表的滚动时间,当用户滚动到列表的底部,并停留一小段时间,便认为用户想要加载下一页的数据,当用户滚回列表的顶部时,展示刷新的按钮,点击便可刷新。

以下是实现的思路,比较粗糙,欢迎各位朋友提出建议。
HTML代码

  • 点击刷新
  • //列表*n ……

js代码

写得匆忙,以上代码没有考虑浏览器的兼容性问题,如:addEventListener等

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/86130.html

相关文章

  • 原生js滚动到底加载数据和下拉刷新 Scrollload

    摘要:原文地址初衷如今移动端站点越来越多,滚动到底部加载数据和下拉刷新的需求非常的常见,即使现在很多站点也会有这样的需求,比如百度首页就有。 原文地址 https://github.com/fa-ge/Scrollload/blob/master/README.md 初衷 如今移动端站点越来越多,滚动到底部加载数据和下拉刷新的需求非常的常见,即使现在很多pc站点也会有这样的需求,比如百度首页...

    HollisChuang 评论0 收藏0
  • 好快, 1分钟开发好一个下拉刷新,滚动加载列表

    摘要:但本活又己交给音长争标识我。八说前它特用达圆是路看江才。开次他争从点军容给油很出。成育料技所心并精北酸间办元。除现七团一历积动两水矿花始线党党她。 好快, 1分钟写好下拉刷新,滚动加载自动分页列表 前言 欢迎关注BUI Webapp专栏 或者 bui神速微信公众号. 以往文章: 2019开发最快的Webapp框架--BUI交互框架 微信Webapp开发的各种变态路由需求及解决办法! ...

    wemall 评论0 收藏0
  • 好快, 1分钟开发好一个下拉刷新,滚动加载列表

    摘要:但本活又己交给音长争标识我。八说前它特用达圆是路看江才。开次他争从点军容给油很出。成育料技所心并精北酸间办元。除现七团一历积动两水矿花始线党党她。 好快, 1分钟写好下拉刷新,滚动加载自动分页列表 前言 欢迎关注BUI Webapp专栏 或者 bui神速微信公众号. 以往文章: 2019开发最快的Webapp框架--BUI交互框架 微信Webapp开发的各种变态路由需求及解决办法! ...

    468122151 评论0 收藏0
  • js实现 web页面的滚动条下拉时加载更多

    摘要:一个更佳的方式是,当滚动条距离底部一定距离时,就动态加载更多,向服务端请求资源。代码总页数当前页数滚动条距离底部的距离没有更多了分页列表的接口相关参考页面在滚动条下拉时加载更多内容个人项目经验下拉加载更多实现监听滚动事件不执行 js实现 web页面的滚动条下拉时加载更多 在手机上,数据列表的分页都是下拉到底部的时候会加载更多,但是,去年三月份的时候遇到了客户要求web页面也要下拉加载更...

    antyiwei 评论0 收藏0

发表评论

0条评论

pekonchan

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<