Question

我正在页面上显示搜索结果列表。在最底部我想放置一个“加载更多”链接，该链接会在页面上的现有链接中附加更多结果，并将“加载更多”链接的参数更改为下一页，这样如果用户点击它，下一页将附加到这页纸。在结果加载时出现“请稍候”或出现一些消息也很好。

使用jQuery执行此操作的最常见和最实用的方法是什么？

谢谢！

Answer 1

我使用类似于以下内容的东西。这是我工作解决方案的简化，省去了无关紧要的事情。希望这可以帮助您入门：

function loadMore(pageNo) {
    $("#loading").html('Loading...').show();
    var url = '/foo/';
    $.get(url, {pageNo: pageNo}, function(response) {
        $("#results").append(response);
        $("#loading").hide();
    });
}

$(document).ready(function() {
    var currPage = 1;
    $("a.next").click(function() {
        loadMore(++currPage);
    });
});

<a class="next">More results</a>

Answer 2

不是那么困难。请执行以下操作

1）在“加载更多”链接上注册自定义处理程序。例如，像

$j('a[name=pageForward]').each(function() {
     $j(this).click(function(e) {
         e.preventDefault();
         defaultPage++;
         doSearch(defaultPage);
      });
})

请注意，我为锚标记添加了name属性。 doSearch确实：

2）激活ajax以加载更多。另外，用“加载”或其他任何

替换加载的内容

$.ajax({
        url: url,
        data: queryString,
        dataType: json or xml,
        cache: false,
        beforeSend: function(xhr) {
        },
        success: function(data, status, xhr) {
        },
        error: function(xhr, status, errorText) {
            that.showNothing();
        },
        complete: function(xhr, status) {
        }
    });

在$ .ajax的jquery文档中查看每个文件的含义。如果你想要你可以处理你之前修改dom和完成你的注册回调。

3）在ajax完成后，填充数据，然后更改链接（或删除“正在加载”消息）。

作为个人偏好，我会禁用2中的链接，并且会出现一个带有“正在加载”消息的特殊div，并且正在进行加载。

另外，更高级的是为你的分页视图创建一个jquery插件......

使用jQuery促进“加载更多”分页的最佳方法是什么？

2 个答案: