Question

首先，我想知道这些术语之间的区别：

- $(window).height() 

- $(document).height() 

- $(window).scrollTop()

这些术语与我有些相似，我无法理解它们之间的明显区别。以下是我的答案：

$(window).height()：给出用户可以看到的窗口高度。
$(document).height()：提供文档的总高度。这可能比窗口高度更多/更少，具体取决于页面上的内容。
$(document).scrollTop()：在窗口中显示滚动条的垂直位置。

真实问题： 我正在尝试实现延迟加载有点事情，当滚动条从页面底部越过一个点200px时我需要调用服务器。我无法使用上述值来获取此信息。

任何帮助将不胜感激。

Answer 1

窗口是您可以看到的区域 - 就好像您的屏幕是一个窗口并且您正在浏览文档一样。该文档是整个文档 - 它可能比窗口更短或更长。

这是你需要的数学：

if( $(document).height() - $(document).scrollTop() < 200 ){
    //Do something
}

Answer 2

$(window).height();   // returns height of browser viewport
$(document).height(); // returns height of HTML document
$(window).scrollTop(); //Get the current vertical position of the scroll bar for the first               element in the set of matched elements or set the vertical position of the scroll bar for every matched element.

$(window).scrollHeight(); //Height of the scroll view of an element; it includes the element padding but not its margin.

Answer 3

最终，在理解了这些术语后，我想出了应该是什么计算。感谢答案。我的定义几乎是正确的。

function (isScrollable) {
  var isUserAtBottom = ($(window).height() + $(window).scrollTop() + 200 > $(document).height());
  if (isUserAtBottom) {
     // Do something (Like Ajax call to server to fetch new elements) 
     return true;
  }
}

获取页面的可滚动高度

3 个答案: