有这样的元素:
<div id="threads-list" style="overflow-y: scroll; height: 200px;">
// Posts
</div>
当用户到达按钮时(或者是10px),我如何提醒()?
这就是我现在正在尝试的事情:
$('#threads-list').scroll(function() {
if ($('#threads-list').height() + $('#threads-list').scrollTop() == document.getElementById('threads-list').offsetHeight) {
console.log('do');
}
});
似乎问题是.offsetHeight返回与.height()(两个200px)相同,这是容器高度而不是内部内容,我认为获取内容的正确高度将是解决问题的关键问题
答案 0 :(得分:0)
offsetHeight
检查是错误的。试试这个:
$('#threads-list').scroll(function() {
var el = $(this);
if (el.height() + el.scrollTop() === this.scrollHeight) {
alert('do');
}
});
scrollHeight
是整个元素的高度,包括当前通过滚动隐藏的部分。
答案 1 :(得分:0)
你应该做
var container = $('#threads-list'),
maxScroll = container[0].scrollHeight - container.height(),
threshold = 10,
endFlag = false;
container.on('scroll', function(e){
if ( maxScroll - container.scrollTop() < threshold ){
if (!endFlag){
endFlag = true;
console.log('The END!');
}
} else {
endFlag = false;
}
});
http://jsfiddle.net/gaby/vXzk3/1/
演示我使用过一面旗帜,以避免在最后多次做你想做的事情。