我想要一个事件来加载更多的内容,当用户滚动并达到几乎底部的页面,说从底部大约100px,问题是事件被触发每一次滚动到低100页的页面,所以这是一个明显的问题,由于显而易见的原因,所以我想知道如何最好地做到这一点,我已经在这里检查了其他答案/问题,但是部分工作的一个解决方案并不适合我需要的做,当我尝试改变它,所以它会完全冻结我的浏览器每次.
这是问题：
Check if a user has scrolled to the bottom
这是问题：
Check if a user has scrolled to the bottom
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
$(window).unbind('scroll');
alert("near bottom!");
}
});
现在就像我说的那样,这样做有效,并且可以防止多个事件被触发,问题是我需要发生无数次的事件,比如当你到达底部时,我加载了100行信息,但还有1500个,我需要它每次重复加载每一个信息量(一旦你达到每页底部100px的一部分)
所以我试图做的是：
function loadMore()
{
alert("More loaded");
$(window).bind('scroll');
}
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
$(window).unbind('scroll');
loadMore();
}
});
就像我说的那样,这样就立即冻结我的浏览器,每次都是绑定部分.
解决方法
我也有同样的问题.我遇到这个
link,真的帮助(并且工作)！
更新：我看了代码,我认为当你重新绑定,你错过了重新绑定的功能.
function loadMore()
{
console.log("More loaded");
$("body").append("<div>");
$(window).bind('scroll',bindScroll);
}
function bindScroll(){
if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
$(window).unbind('scroll');
loadMore();
}
}
$(window).scroll(bindScroll);
