javascript - 客户端无限滚动 JQuery

Question

我正在尝试为我的网站制作一个 [twitter like - LazyLoad] 评论页面。我发现很多使用 PHP [用于服务器端] 的插件。

我试过：Sausage、Jquery4u、Infinite Ajax Scroll .. &这里还有很多

我使用 C#，所以我只想要一个在客户端使用静态数据的插件，以便稍后使用 Json 处理它。

有没有像这样工作的 Continuos 滚动插件？

Answer 1

Masonry 允许您执行此操作，包括显示数据的奇特方式。您可以从该代码中获取加载程序

http://masonry.desandro.com/demos/infinite-scroll.html

Answer 2

您展示的其中一个示例可以与任何服务器端技术（包括 ASP.NET）很好地配合使用。

只需一些基本的 HTML 即可开始：

<div id="posts">
   <div class="item">Starting content</div>
   <div id="loadmore" style="display: none"><img src="ajax-loader.gif" alt="Loading..." /></div>
</div>

还有一小段 jQuery 代码（不需要插件）：

$(window).scroll(function() {
    if ($(window).scrollTop() == $(document).height() - $(window).height()) {
        $("#loadmore").show();

        $.ajax({
          url: "loadmore.aspx",
          contentType: "text/html; charset=utf-8"
        ).done(function(html) {
            if (html) {
                $("#posts").append(html);
                $("#loadmore").hide();
            } else
                $("#loadmore").html("No more posts to show.");
        });
    }
});

由于 ASPX 代码呈现为 HTML，因此可以将内容附加到 #posts 包装器上。您当然需要稍微调整代码，将一些参数传递给您的 ASPX 以了解要检索多少帖子并从哪个帖子开始......但是客户端代码不再是这里的问题了。