javascript - 向下滚动时自动加载内容

Question

我正在 django/webfaction 上创建一个博客。我的主页目前默认显示 4 个帖子（帖子限制为 4 on querysetin urls.py）。现在，一旦用户到达页面底部，我想再加载四篇文章，并继续这样做，直到到达最后一篇文章。如何做到这一点？

Answer 1

如果您想在到达文档的最底部时加载您的内容，请使用以下代码：

$(window).scroll(function()
{
    if($(window).scrollTop() == $(document).height() - $(window).height())
    {
          // load your content
    }
});

如果您想在底部达到 100 像素之前加载内容使用

var loading= false;
$(window).scroll(function() {
    if (!loading && ($(window).scrollTop() >  $(document).height() - $(window).height() - 100)) {
        loading= true;

        // your content loading call goes here.

        loading = false; // reset value of loading once content loaded
    }
});

Answer 2

你可以试试这样的..

var processScroll = true;
$(window).scroll(function() {
    if (processScroll  && $(window).scrollTop() > $(document).height() - $(window).height() - 100) {
        processScroll = false;
        // your functionality here
        processScroll = true;
    }
});

Answer 3

您可以进行 Ajax 调用以获取有关元素“onscroll”事件的更多帖子（在您的情况下可能在 body 上）。您可以使用此处记录的 jquery 的“.scroll()”进行相同的调用：http: //api.jquery.com/scroll/

您可能可以维护一个 previous-top 语句来确定当前滚动的方向。