檢測可滾動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");
    }
});