Tumblr Like Button Not Working

Question

我正在設計一個同時使用砌體和無限滾動代碼的tumblr主題。 The infinite scrolling code is here，如果你需要查看它。類似的按鈕在所有帖子上正確顯示，並在前幾個帖子上工作，但不適用於新加載的帖子。

每個帖子都添加了{PostID}標識。我有JavaScript的一個真正的窮人的理解，所以我認爲這是問題的所在：

$(function(){ 
    var $container = $('#content'); 
    $container.imagesLoaded(function(){ 
     $container.masonry({ 
      itemSelector: '.entry', 
      isAnimated:true, 
      columnWidth:1, 
      animationOptions:{duration:350, queue:false}, 
      isFitWidth: true, 
     }); 
    }); 

    $container.infinitescroll({ 
      navSelector : '#page-nav', // selector for the paged navigation 
      nextSelector : '#page-nav a', // selector for the NEXT link (to page 2) 
      itemSelector : '.entry',  // selector for all items you'll retrieve 
      loading: { 
       finishedMsg: '{lang:No more posts}', 
       img: 'http://24.media.tumblr.com/tumblr_m3j5g3KlEm1r0fipko8_r1_100.gif' 
      } 
     }, 
     // trigger Masonry as a callback 
     function(newElements){ 
      // hide new items while they are loading 
      var $newElems = $(newElements).css({ opacity: 0 }); 
      // ensure that images load before adding to masonry layout 
      $newElems.imagesLoaded(function(){ 
       // show elems now they're ready 
       $newElems.animate({ opacity: 1 }); 
       isAnimated:true 
       $container.masonry('appended', $newElems, true); 
      }); 
      // videos 
      $newElems.find('.video').each(function(){ 
       resizeVideos(); 
       console.log($newElems, $newElemsIDs); 
       Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs); 
      }, 
      function(){ 
       $container.masonry(); 
      }); 
     } 
    ); 
}); 

任何幫助將不勝感激！

Answer 1

即使這個問題是重複的，這是一個不完整的副本/麪食噩夢。

圖片加載

$newElems.imagesLoaded(function(){ 
    // show elems now they're ready 
    $newElems.animate({ opacity: 1 }); 
    isAnimated:true 
    $container.masonry('appended', $newElems, true); 
}); 

1. isAnimated:true將誤差作爲其用於調用masonry

Like按鈕

$newElems.find('.video').each(function(){ 
    resizeVideos(); 
    console.log($newElems, $newElemsIDs); 
    Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs); 
}, 

一鍵/值

1. $newElemsIDs是從來沒有定義或填充
2. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);將錯誤，因爲上述
3. Tumblr.LikeButton.get_status_by_post_ids()僅會被調用，如果有infiniteScroll結果包含一個視頻後
4. });缺少

砌體

function(){ 
    $container.masonry(); 
}); 

1. $container.masonry('appended', $newElems, true);已經告訴masonry有新的項目，就沒有必要再調用它

完成麪食

$(function(){ 
    var $container = $('#content'); 
    $container.imagesLoaded(function() { 
     $container.masonry({ 
      itemSelector: '.entry', 
      isAnimated:true, 
      columnWidth:1, 
      animationOptions:{duration:350, queue:false}, 
      isFitWidth: true, 
     }); 
    }); 

    $container.infinitescroll({ 
      navSelector : '#page-nav', // selector for the paged navigation 
      nextSelector : '#page-nav a', // selector for the NEXT link (to page 2) 
      itemSelector : '.entry',  // selector for all items you'll retrieve 
      loading: { 
       finishedMsg: '{lang:No more posts}', 
       img: 'http://24.media.tumblr.com/tumblr_m3j5g3KlEm1r0fipko8_r1_100.gif' 
      } 
     }, 

     // trigger Masonry as a callback 
     function(newElements) { 

      // hide new elements 
      var $newElems = $(newElements).css({ opacity: 0 }); 

      // create $newElemsIDs 
      var $newElemsIDs = $newElems.map(function() { 
       return this.id; 
      }).get(); 

      // give tumblr the $newElemsIDs 
      Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs); 

      // ensure that images load before adding to masonry layout 
      $newElems.imagesLoaded(function() { 

       // tell masonry we have added new elems 
       $container.masonry('appended', $newElems, true); 

       // show $newElems 
       $newElems.animate({ opacity: 1 }); 
      }); 

      // resize videos for $newElems 
      $newElems.find('.video').each(function() { 
       resizeVideos(); 
      }); 
     } 
    ); 
});