Question

我正在尝试为我的Instagram式Rails应用程序实现无限滚动。但是，正在执行以呈现要呈现的帖子的下一页的jQuery jode正在被执行两次。

我尝试添加黑客，但它并不完全有效。

以下是代码：

var exec = false;
$(window).scroll(function() {
    if ($('#paginator').length) {
        var url = $('#load_more').attr('href');
        if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50 && !exec) {
            exec = true;
            $.get(url, function(data) {
                $('#paginator').append('<div class="spinner"></div>');
                $.getScript(url);
            }).done(function(){ exec = false; });
        }
    }
});

重复的部分显然是重复的ajax请求，所以post chunk被追加两次。

如何解决此问题？

Answer 1

首先，检查文档高度与窗口高度在某些浏览器中不起作用。因此，通过一个名为GL_TRUE的新jQuery方法，扩展jQuery以检查#load_more或您想要触发分页的任何其他元素是否在视图中。其次，使用inView查看有多少活动的ajax请求正在发生。如果它为0，你可以触发无限滚动：

$.active

使用无限滚动防止重复执行

1 个答案: