Javascript 如何检查滚动条是否位于底部

如何检查滚动条是否位于底部？使用JQuery或JavaScript查找滚动容器的高度，然后将其与滚动位置进行比较。如果它们是相同的，那么你已经到达了底部

<div style="overflow: auto; height: 500px">
</div>

$(document).ready(function()
{
   $('div').scroll(function()
   {
      var div = $(this);
      if (div.height() == div.scrollTop() + 1) //scrollTop is 0 based
      {
          alert('Reached the bottom!");
      }
   });
});

---

您可以检查元素

scrollTop

是否等于元素

innerHeight

if($('div').scrollTop() == $('div').innerHeight()){
    //Reached the bottom
}

这对我很有用（使用jQuery）：

---

摘自。

这对我的聊天窗口很有效。它还检测内容是否不够长，无法滚动

function atBottom(ele) {
    var sh = ele.scrollHeight;
    var st = ele.scrollTop;
    var ht = ele.offsetHeight;
    if(ht==0) {
        return true;
    }
    if(st == sh - ht)
        {return true;} 
    else 
        {return false;}
}

let div=document.getElementById（“div”）；
if（（div.scrollHeight-div.scrollTop）=div.clientHeight）{
警报（“在底部”）；
}

是的，但水平滚动条或垂直滚动条不起作用？@redoc01然后发布您的代码，以便我们更正it@redoc01看看我修改过的答案。我还为一个演示提供了一个JSFIDLE。可能是@DavidHedlund的副本如果他正在寻找一个IE6和7兼容的方法，那么这将不起作用，你是正确的。他没有给出任何关于浏览器支持要求的细节。这对我来说不适用——但是，如果我将它与div.innerHeight进行比较，它就可以了。我想边际/填充在某种程度上影响了这一点？我不完全确定，从这里开始。帮助了我，正如我所期待的：）

$(document).ready(function(){
  $('div').scroll(function(){
    //scrollTop refers to the top of the scroll position, which will be scrollHeight - offsetHeight
    if(this.scrollTop == (this.scrollHeight - this.offsetHeight)) {
      console.log("Top of the bottom reached!");
    }
  });
});

function atBottom(ele) {
    var sh = ele.scrollHeight;
    var st = ele.scrollTop;
    var ht = ele.offsetHeight;
    if(ht==0) {
        return true;
    }
    if(st == sh - ht)
        {return true;} 
    else 
        {return false;}
}