javascript - 如何计算结束 chrome 上的 div 滚动？

Question

我有一个高度为 100 像素的 div 标签，overflow-y 设置为自动。我写了一些 jquery 代码来检查滚动条是否到达底部。我将其用于我正在处理的无限滚动元素。

这似乎适用于 Firefox，但不适用于 Chrome。有人可能知道为什么它不适用于 Chrome？

下面是我的代码。

<script>

$( "#scroll" ).scroll(function() {

    var content = $(this).scrollTop() + $(this).innerHeight();

    if (content == $(this)[0].scrollHeight) {

        // $( "span" ).css( "display", "inline" ).fadeOut( "slow" );
        console.log("reach end");

    }
});



</script>


        <style>
        #scroll{

  max-height: 100px;
  overflow-y: auto;
  width: 647px;
  margin: auto;
        }
    </style>


<div id='scroll'>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>
<p>hello world</p>

</div>

Answer 1

查看 Chrome 给出的高度值，当您想要的值为 402 时，它只会达到 ( in this example ) 401.81817626953125，因此请确保您四舍五入。

var content = Math.ceil($(this).scrollTop() + $(this).innerHeight());

以防万一值更高，我也会将此行更改为大于或等于

if (content >= $(this)[0].scrollHeight) {