滚动加载数据时怎么判断到底部了？

UI爱红提问于 2026-03-09 21:20:19 阅读 3

交互

我在做列表页的滚动加载，监听 scroll 事件后用 window.innerHeight + window.scrollY >= document.body.offsetHeight 判断是否到底，但有时候会触发多次，甚至在还没滚到底的时候就提前加载了，这咋回事？

我试过加防抖，但还是不太稳定。是不是这个判断条件有问题？我的容器不是 window，而是某个固定高度的 div，是不是得换种方式算？

滚动加载滚动效果

我来解答赞 1 收藏

反馈

1 条解答

UX熙苒 Lv1

啊这个啊...用固定高度div的话确实不能用window那套。试试这个：

const container = document.getElementById('你的容器id');

container.addEventListener('scroll', () => {

  if (container.scrollTop + container.clientHeight >= container.scrollHeight - 20) {

    // 加载更多数据

  }

});

那个-20是缓冲值，防止太敏感触发多次，差不多就行。

2026-03-09 22:01