element滚动条到底部后不要继续加载超过页面
时间: 2023-08-18 21:09:52 浏览: 75
如果你想让滚动条到达底部后停止继续加载数据,可以通过监听滚动条的位置来实现。具体做法是:
1. 获取滚动条的位置和元素的高度:
```js
const element = document.getElementById('scroll-container');
const scrollTop = element.scrollTop;
const scrollHeight = element.scrollHeight;
const clientHeight = element.clientHeight;
```
2. 判断是否到达底部:
```js
if (scrollTop + clientHeight >= scrollHeight) {
// 到达底部,不再继续加载数据
return;
}
```
3. 如果没有到达底部,继续加载数据。
完整代码示例:
```js
const element = document.getElementById('scroll-container');
element.addEventListener('scroll', function() {
const scrollTop = element.scrollTop;
const scrollHeight = element.scrollHeight;
const clientHeight = element.clientHeight;
if (scrollTop + clientHeight >= scrollHeight) {
// 到达底部,不再继续加载数据
return;
}
// 继续加载数据
loadData();
})
```
其中,`loadData()` 是你自己实现的加载数据的函数。
阅读全文