获取dom容器中的滚动百分比

我有一个应用程序,内容应该在用户向下滚动时加载(如Twitter / Facebook …)。

我正在尝试根据滚动事件和当前滚动位置检测何时加载更多数据。

我读过这篇文章: https : //stackoverflow.com/a/3898152/82609

if($(window).scrollTop() + $(window).height() == $(document).height()) { console.error("bottom!"); } 

这几乎可以工作,但在我的情况下,当我滚动到底部我有

 $(window).scrollTop() + $(window).height() > $(document).height() 

窗口滚动顶部+窗口高度如何大于高度? 它不是那么大,只是一点点。

 console.error("$(window).scrollTop() + $(window).height()=",$(window).scrollTop() + $(window).height()," VS $(document).height()",$(document).height()); // It gives me in the console: $(window).scrollTop() + $(window).height()= 877 VS $(document).height() 872 

很多时候,当我完全滚动到底部时,我会得到一些来自无处的额外像素。 有人可以解释一下吗?


我正在尝试计算容器中滚动内容的百分比:

  getScrollPercentage: function(scrollableElementSelector) { var scrollableElement = $(scrollableElementSelector); // This is the number of hidden pixels of the scrollable element inside its container var hiddenHeigth; if ( scrollableElementSelector === window ) { hiddenHeigth = $(document).height() - $(window).height(); } else { hiddenHeigth = scrollableElement[0].scrollHeight - scrollableElement.outerHeight(); } // This is the number of scrolled pixels var scrolledHeight = scrollableElement.scrollTop(); if ( hiddenHeigth < scrolledHeight ) { //throw new Error("hiddenHeigth "+hiddenHeigth+"  Impossible unless you didn't use this function correctly"); } var scrollPercent = ( scrolledHeight / hiddenHeigth ) * 100; if ( this.debug ) { console.debug("hiddenHeigth=",hiddenHeigth,"scrolledHeight=",scrolledHeight,"scrollPercent=",scrollPercent); } return scrollPercent; } 

这个function运行得很好,除非我滚动到底部,我经常得到103% – >对我的用例来说不是什么大不了但我正试图理解这个问题。

尝试使用$(document).outerHeight()而不是$(document).height()

FIDDLE WORKING