"无限滚动"代码仅适用于顶部滚动

时间:2014-07-09 09:50:17

标签: javascript jquery infinite-scroll

我正在使用“通用”js片段来检测用户是否已滚动到文档的底部:

 $(window).scroll(function() {
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {
            //ajax code here
        }
    });

当用户滚动时,新内容应通过ajax调用加载。

我希望在滚动DOWN时触发代码,但是当我滚动回到页面顶部时,条件实际上正在触发,所以它基本上与它“应该”做的相反。

我已经看到这个解决方案被用在很多例子中,例如: https://stackoverflow.com/a/17078097/1623095

我的调试信息:

console.log($(window).scrollTop());
console.log($(document).height());
console.log($(window).height());

滚动到顶部时输出:

0 
1956 
1956 

底部:

961 
1956
1956 

我页面中唯一加载的插件是jquery(1.10.0.min),由于项目的性质,我无法链接到该页面。

彻底迷惑了这里的dom行为。

1 个答案:

答案 0 :(得分:1)

我之前为别人解决了这个问题。

看看here

<强>代码

$(window).scroll(function () {
        //- 10 = desired pixel distance from the bottom of the page while scrolling)
        if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) {
            var box = $("#scrollbox");
            //Just append some content here
            box.html(box.html() + "<br />fa");
        }
});

Fiddle

只需将您的ajax代码放在我用简单的html中断扩展内容的地方

相关问题