检测可滚动DIV是否已到达底部

Question

我有一个<div> overflow: scroll; 应用时，我想检测它何时滚动，并在其达到剩余总高度的5％时触发。

JSBin-当前，当它到达页面底部时，我无法触发。

<div style="height:50%;overflow:scroll;">
  <b style="height:5000px;display:block;"></b>
</div>


$('div').on('scroll', function(){

  if($(window).scrollTop() + $('div').height() == $('div').height()) {
    console.log("bottom of page");
  }

});

Answer 1

在您的示例中，该窗口不可滚动，而div是可滚动的。 这导致div是检查scrollTop（）函数时要查找的元素。 同样，这里的总和大于您的b元素（您需要检查）并且不相等。 因此，如下所述更改行，代码将按您期望的那样执行：

$('div').on('scroll', function(){
    if($("div").scrollTop() + $('div').height() > $('b').height()) {
        console.log("bottom of page");
    }
});