下拉加载更多+防止多次触发

需要在聊天互动展示列表展示，滑动到最下面，重新请求加载数据

 

 

利用 滚动的位置+滚动的距离 - （自定义的偏移量）》=元素盒子的高度 来计算是否元素内部滚动到了底部：nScrollTop + nDivHight> nScrollHight
因为1px 也是超出，有可能造成多次请求，所以要进行一下定时器延迟执行

$('.scroll_box').scroll(function () {
        var type=$(this).attr('data-type');
        var  obj=$('.chat');
        switch (type) {
            case 'chat':
               
                break;
            case 'question':
                obj=$('.que_r')
                break;
            case 'online':
                obj=$('.online_lists')
                break;
            default:
                break
        }
        var nDivHight = obj.height();//元素的固定高度
        var nScrollHight = $(this)[0].scrollHeight;//滚动距离总长
        var nScrollTop = $(this)[0].scrollTop;//滚动到的当前位置
//40是偏差大小
        if(nScrollTop + nDivHight-40> nScrollHight){
            getLoadMore()
        }
    });

    var loadMore=(type)=>{
       //ajax掉数据
        console.log('获取数据')
    }
//防止多次触发
    var debounce=(func,wait=1000)=>{
        var timeout;
//利用定时器 执行回调函数 
        return function(event){
            clearTimeout(timeout);
            timeout=setTimeout(()=>{
                func(event)
            },wait)
        }
    }
    var getLoadMore=debounce(loadMore)

　　

  用intersectionObserver浏览器原生提API实现下拉加载更多的地址：https://www.cnblogs.com/GoTing/p/13903449.html