javascript&jquery 判断滚动到页面底部

 

js 判断滚动到页面底部

CreateTime--2018年4月14日10:13:07

Author:Marydon

1.使用场景：

　　滚动到屏幕底部，触发加载分页数据请求（qq空间，手机端）

2.代码实现

　　javascript方式

window.onscroll = function() {
    //获取被卷去高度
    var scrollTop = document.body.scrollTop;
    //获取窗口高度（可见区域高度）
    var windowHeight = document.documentElement.clientHeight;
    //获取文档高度
    var documentHeight = document.body.scrollHeight;
    if (scrollTop + windowHeight >= documentHeight) {
        $('#nomore').show();
        //发送Ajax请求获取分页数据
    }
}

　　jQuery方式

$(window).scroll(function() {
    //获取被卷去高度
    var scrollTop = $(this).scrollTop();
    //获取窗口高度（可见区域高度）
    var windowHeight = $(this).height();
    //获取文档高度
    var documentHeight = $(document).height();
    if (scrollTop + windowHeight >= documentHeight) {
        $('#nomore').show();
        //发送Ajax请求获取分页数据
    }
});

区别：javascript的onscroll事件只能定义一次，而jQuery的scroll事件可以定义多次，还不会冲突。

相关推荐：

js 判断进入可视区域