我有一个div框(称为flux)，里面有可变数量的内容。 此divbox已将溢出设置为自动。
现在，我要做的是，当使用滚动到这个div框的底部，加载更多的内容到页面，我知道如何做到这一点(加载内容)，但我不知道如何检测当用户已经滚动到div标签的底部? 如果我想对整个页面都这样做，我将使用。scrolltop并从。height中减去它。
但我在这里好像做不到?
我已经尝试从通量。scrolltop，然后包装内的所有内容在一个div称为内部，但如果我采取通量的innerHeight它返回564px (div被设置为500作为高度)和“内部”的高度它返回1064，而滚动顶部，当在div的底部说564。
我该怎么办?
当前回答
我精心编写了这段代码，用于检测何时滚动到元素的末尾!
let element = $('.element');
if ($(document).scrollTop() > element.offset().top + element.height()) {
/// do something ///
}
其他回答
如果你需要在一个隐藏了overflow-y或滚动的div上使用它，像这样的东西可能就是你需要的。
if ($('#element').prop('scrollHeight') - $('#element').scrollTop() <= Math.ceil($('#element').height())) {
at_bottom = true;
}
我发现celll是需要的，因为prop scrollHeight似乎是圆的，或者可能是其他原因导致这是由小于1。
伙计们，这是缩放问题的解决方案，它适用于所有缩放级别，以防你需要它:
if ( Math.abs(elem.offset().top) + elem.height() + elem.offset().top >= elem.outerHeight() ) {
console.log("bottom");
// We're at the bottom!
}
});
}
不确定是否有任何帮助，但这就是我的做法。
我有一个比窗口大的索引面板，我让它滚动，直到达到这个索引。然后我把它固定好。一旦你滚动到页面顶部，这个过程就反过来了。
的问候。
<style type="text/css">
.fixed_Bot {
position: fixed;
bottom: 24px;
}
</style>
<script type="text/javascript">
$(document).ready(function () {
var sidebarheight = $('#index').height();
var windowheight = $(window).height();
$(window).scroll(function () {
var scrollTop = $(window).scrollTop();
if (scrollTop >= sidebarheight - windowheight){
$('#index').addClass('fixed_Bot');
}
else {
$('#index').removeClass('fixed_Bot');
}
});
});
</script>
不过这对我来说很管用
$(window).scroll(function() {
if ($(window).scrollTop() >= (($(document).height() - $(window).height()) - $('#divID').innerHeight())) {
console.log('div reached');
}
});
我精心编写了这段代码，用于检测何时滚动到元素的末尾!
let element = $('.element');
if ($(document).scrollTop() > element.offset().top + element.height()) {
/// do something ///
}
