这篇文章将为大家详细讲解有关jQuery怎么实现判断滚动条滚动到document底部，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。
创新互联专注于平罗企业网站建设,响应式网站,商城网站建设。平罗网站建设公司,为平罗等地区提供建站服务。全流程按需求定制开发，专业设计，全程项目跟踪，创新互联专业和态度为您提供的服务
本文实例讲述了jQuery实现判断滚动条滚动到document底部的方法。分享给大家供大家参考，具体如下：
滚动条没有实际的高度。只是为了呈现效果才在外型上面有长度。
在js当中也没有提供滚动条的高度API。
参考了网上有关资料：判断滚动条到底部的基本逻辑是滚动条滚动的高度加上视口的高度，正好是document的高度，公式表示为
滚动条滚动的高度+浏览器视口的高度>=document的高度。
参考网上资料，具体代码如下：
//滚动条在Y轴上的滚动距离
function getScrollTop() {
var scrollTop = 0,
bodyScrollTop = 0,
documentScrollTop = 0;
//兼容谷歌
if (document.body) { bodyScrollTop = document.body.scrollTop; }
//兼容火狐
if (document.documentElement) { documentScrollTop = document.documentElement.scrollTop; }
scrollTop = (bodyScrollTop - documentScrollTop > 0) ? bodyScrollTop : documentScrollTop;
return scrollTop;
}
//文档的总高度
function getScrollHeight() {
var scrollHeight = 0,
bodyScrollHeight = 0,
documentScrollHeight = 0;
//兼容谷歌
if (document.body) {
bodyScrollHeight = document.body.scrollHeight;
}
//兼容火狐
if (document.documentElement) {
documentScrollHeight = document.documentElement.scrollHeight;
}
scrollHeight = (bodyScrollHeight - documentScrollHeight > 0) ? bodyScrollHeight : documentScrollHeight;
return scrollHeight;
}
//浏览器视口的高度
function getWindowHeight() {
var windowHeight = 0;
windowHeight = document.documentElement.clientHeight;
return windowHeight;
}
window.onscroll = function() {
if (getScrollTop() + getWindowHeight() == getScrollHeight()) {
alert("you are in the bottom!");
}
};jquery实现代码：
$(window).scroll(function(){
var scrollTop = $(this).scrollTop();
var scrollHeight = $(document).height();
var windowHeight = $(this).height();
if(scrollTop + windowHeight == scrollHeight){
alert("you are in the bottom");
}
});代码测试有效果。
关于“jQuery怎么实现判断滚动条滚动到document底部”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。
