检测是否在移动设备上滚动到底部

Question

我需要检测用户是否已滚动到可滚动 div 的底部。我认为下面的代码应该可以正常工作，并且可以在台式计算机上运行，​​但不能在移动设备（在这种情况下为 Android、Chrome 浏览器）上运行。

var scrolledToEnd = el.scrollHeight - el.scrollTop === el.clientHeight

可滚动的 div 将 overflow 设置为 auto。它的 clientHeight 是 150px。

滚动到底部时的桌面结果

• el.scrollHeight - el.scrollTop 是 150
• el.clientHeight 是 150

滚动到底部时的移动结果

• el.scrollHeight - el.scrollTop 是 149.90476
• el.clientHeight 是 150

为什么移动设备上的结果不同？有没有办法使这项工作也适用于移动设备？目前我还没有想出解决方案。

希望有人能帮忙，提前致谢。

Answer 1

你可以使用

var scrolledToEnd = el.scrollHeight - Math.round(el.scrollTop) === el.clientHeight;

如果您阅读MDN，您会注意到

<块引用>

在使用显示缩放的系统上，scrollTop 可能会给您一个十进制值。