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

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

使用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); }); }); More results 

Answer 2

没那么难。 请执行下列操作

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

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

请注意我为锚标签添加了name属性。 doSearch做：

2）激活ajax以加载更多。 另外，用’Loading’或其他任何东西替换更多的载荷内容

 $.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插件…