0

我正在尝试使用 jQuery 和一些 Ajax 设置自定义无限滚动。这是我到目前为止所拥有的：

        $(window).scroll(function() {
            if($(window).scrollTop() + $(window).height() == $(document).height()) {
                $.ajax({
                    type: "POST",
                    url: "posts/view/",
                    data: "",
                    success: function(results){
                        $(".container").after(results);
                    }
                })
            }
        });

这一切都很好，花花公子，但我正在努力想象的是如何获得下一个“集合”或“页面”数据。我正在使用 PHP，在我的函数中我会有类似 getMore($page = 1) 的东西。但是我怎样才能让 jQuery 跟踪它当前所在的页面，并知道下一个页面是什么？我是否应该在 jQuery 中设置某种增量函数，以便它提取 URL（例如，posts/page/1/），然后简单地将 1 添加到它通过 Ajax 传递的 url？

我觉得我真的想多了，有没有更简单的方法？

4

2 回答 2

2

只需在滚动闭包内使用页面计数器：

(function(){

    //inner functions will be aware of this
    var currentPage = 0;

    $(window).scroll(function() {

        if($(window).scrollTop() + $(window).height() == $(document).height()) {

         $.ajax({
             type: "GET",
             url: "posts/view/" + currentPage,
             data: "",
             success: function(results){
                 $(".container").after(results);
             }
         })

         currentPage++;

         }

    });

})();​

并根据page您传递的参数更改您的服务器脚本。如果没有更多可以检索的内容，只需用空的身体回答即可。

顺便说一下，POST不适合检索数据，GET改用吧。

于 2012-09-02T18:25:59.077 回答
2

你可以选择更简单的方法。像这样放置一个隐藏字段

<input type hidden value="1" id="page" />

现在在每个 ajax 发送之前从该隐藏字段中获取页面值。并且在每个 ajax 成功函数之后像这样增加隐藏的字段值。

$('#page').val(parseInt($('#page').val())+1)

您的 ajax 调用将如下所示

$(window).scroll(function() {
        if($(window).scrollTop() + $(window).height() == $(document).height()) {
            $.ajax({
                type: "POST",
                url: "posts/view/"+$('#page').val(),
                data: "",
                success: function(results){
                    $('#page').val(parseInt($('#page').val())+1);
                    $(".container").after(results);
                }
            })
        }
    });
于 2012-09-02T18:18:53.747 回答