- 监听document
document.onscroll = () => {
if (document.documentElement.clientHeight
+ (document.documentElement.scrollTop || document.body.scrollTop)
=== document.documentElement.offsetHeight) {
// do something
}
}
- 监听container
.container {
position: absolute;
height: auto;
top: 0;
bottom: 0;
width: auto;
left: 0;
right: 0;
overflow: auto;
-webkit-overflow-scrolling: touch; /* 兼容webkit滚动卡顿问题 */
}
<div class="container">
<div class="content">
</div>
</div>
const container = document.getElementsByClassName('container')[0]
const content = document.getElementsByClassName('content')[0]
container.onscroll = () => {
if (container.clientHeight + container.scrollTop === content.offsetHeight) {
// do something
}
}
需要注意的是: absolute在ios上面有兼容性问题