上拉加载更多

Posted mmy67

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了上拉加载更多相关的知识,希望对你有一定的参考价值。

//--------------上拉加载更多---------------
        //获取滚动条当前的位置 
        function getScrollTop() {
            var scrollTop = 0;
            if(document.documentElement && document.documentElement.scrollTop) {
                scrollTop = document.documentElement.scrollTop;
            } else if(document.body) {
                scrollTop = document.body.scrollTop;
            }
            return scrollTop;
        }

        //获取当前可视范围的高度 
        function getClientHeight() {
            var clientHeight = 0;
            if(document.body.clientHeight && document.documentElement.clientHeight) {
                clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight);
            } else {
                clientHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
            }
            return clientHeight;
        }

        //获取文档完整的高度 
        function getScrollHeight() {
            return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
        }
        
        //滚动事件触发
        window.onscroll = function() {
            if(getScrollTop() + getClientHeight() == getScrollHeight()) {
               34             }
        }
        //-----------------结束--------------------

  

以上是关于上拉加载更多的主要内容,如果未能解决你的问题,请参考以下文章

硅谷新闻6--下拉刷新/上拉加载更多

上拉加载实现

Android RecyclerView上拉加载更多item点击事件(显示获取的数据)

uniapp实现上拉加载更多及下拉刷新(假数据版)

iOS 下拉刷新和上拉加载更多效果原理

前端上拉加载更多dropload.min.js的使用