如何在无限滚动加载新页面后请求类似 Tumblr 的按钮状态

Question

这是来自 Tumblr 文档的说明：

Tumblr.LikeButton.get_status_by_page(n)：请求新一页帖子后调用该函数。将刚刚加载的页码作为整数。

Tumblr.LikeButton.get_status_by_post_ids([n,n,n])：请求单个帖子的点赞状态。接受一个帖子 ID 数组。

这个问题在here 和here 的解决方案中被问过几次，这两个答案都可以告诉您如何使用帖子 ID 请求类似按钮的状态。那么是否有更简单且可能更快的解决方案？

我会分享我的做法，也请分享您的意见。

Answer 1

接受的答案here 中发生的情况是：

1. 首先，您必须为所有帖子提供 ID。
2. 加载新帖子后，查找所有具有类 (.post) 的元素（帖子）。
3. 获取新帖子的 ID。
4. 使用新帖子 ID 数组请求按钮状态

现在，您可以在新页面加载页码后请求类似按钮的状态。

1. 首先获取页面中的帖子数。
2. 加载新帖子后再次获取帖子数量。
3. 将当前帖子数除以初始帖子数得到页码。

4. 请求带有页码的按钮状态。

       var $initialNumberOfPosts = $('.post').length; // Get number of posts
   
       $('#posts').infinitescroll({
         loading: {
           msgText: "Loading..",
           img: "/loading_image.gif",
           finishedMsg: "End!"
         },
           navSelector  : "#pagination",
           nextSelector : "#nextpage",
           itemSelector: ".post"
       },
       function(newElements) {
   
           var $currentNumberOfPosts = $('.post').length; // Get current number of posts
   
           var pageNumber = Math.ceil($currentNumberOfPosts / $initialNumberOfPosts); // Get page number
   
           Tumblr.LikeButton.get_status_by_page(pageNumber); // Request like button status
       });
   

*使用 (.ceil) 因为用户可能每页选择了 15 个帖子，但可能少于最后一页的帖子。

更新：2014 年 3 月 5 日。

他们更简单的方法是使用 Tumblr 变量获取页码并在新页面加载时增加它。请尝试以下操作：

1. 首先使用 Tumblr 变量获取页码：{CurrentPage}。
2. 加载新页面后增加当前页码。

3. 使用当前页码请求按钮状态。

       var pageNumber = {CurrentPage}; // Get current Page number ( Will not work in external file)
   
       $('#posts').infinitescroll({
         loading: {
           msgText: "Loading..",
           img: "/loading_image.gif",
           finishedMsg: "End!"
         },
           navSelector  : "#pagination",
           nextSelector : "#nextpage",
           itemSelector: ".post"
       },
       function(newElements) {
   
           pageNumber++; // Get page number after new page is loaded.
   
           Tumblr.LikeButton.get_status_by_page(pageNumber); // Request like button status
       });
   

// 结束更新。

*这是一个示例脚本，说明如何使用 Paul Irish 的无限滚动请求按钮状态。

因此，这两种方式都大约需要 3 到 4 个步骤。我的解决方案似乎更容易为我设置，所以我使用它。你可以使用你觉得更好的东西。

我认为我的解决方案更快，因为它使用简单的功能，但这正是我的想法；我暂时没有任何证据。谢谢！