$(window).scrollTop() == $(document).height() - $(window).height() 的含义答案

【问题标题】：Meaning of $(window).scrollTop() == $(document).height() - $(window).height()$(window).scrollTop() == $(document).height() - $(window).height() 的含义
【发布时间】：2013-03-19 09:42:47
【问题描述】：

以下代码用于检测用户是否滚动到页面底部并且它可以工作。

if($(window).scrollTop() == $(document).height() - $(window).height()){
//do something
}

问题：

我不明白为什么要从文档的高度中减去窗口的高度，然后将其与滚动高度进行比较以确定是否已到达页面底部。为什么不简单

if($(window).scrollTop() == $(document).height()){
//do something
}

或

if($(window).scrollTop() ==  $(window).height()){
//do something
}

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

这是因为$(window).scrollTop()返回页面顶部的位置，$(document).height()返回页面底部的位置。因此，您需要减去窗口的高度来获得要比较的位置，因为如果您完全滚动到底部，这将为您提供页面顶部的位置。

【讨论】：

那么我怎样才能将它从窗口更改为特定的 div 呢？用 ('#scrollbar') 替换 (window) ？你能告诉我正确的语法吗，谢谢:)
我相信以下是正确的，您可能要检查跨浏览器，因为我只在 chrome 中测试过：jsfiddle.net/e1uxn46k。本质上你做了一个非常相似的事情，但你检查 div 的滚动高度与滚动顶部 + 内部高度。
对我不起作用。滚动到底部：[$(document).height(), $(window).height(), $(window).scrollTop()] 是 [408, 408, 64]。当我滚动到顶部 [408, 408, 0] 时：这是满足相等条件并附加新内容的时候。诡异的！我希望在滚动到底部时追加。
我只是想标记一下，以防它对其他人有帮助。此代码将在 100% 浏览器缩放下工作，但不一定在其他缩放级别下工作。有关更多信息，请参阅此处的讨论：stackoverflow.com/questions/8670682/…

【解决方案2】：

$(window).scrollTop() 是窗口top 相对于文档的位置。在我现在正在查看的页面上，如果我滚动到最底部，那就是1385。 $(document).height() 是整个页面的高度（1991 对我来说）。 $(window).height() 是窗口（视口）的高度（对我来说是606）。这意味着视口顶部的位置加上窗口的高度就是视口的bottom的位置。 1385 + 606 = 1991.

【讨论】：

【解决方案3】：

scrollTop 值永远不会与文档高度值一样高。这意味着您滚动了文档，使其全部位于窗口之外。

将scrollTop 与窗口高度进行比较仅意味着您向下滚动了一屏，而不是文档的底部。

当窗口底部位于文档底部时，从文档高度中减去窗口高度会得到 scrollTop 的值。

【讨论】：