Tumblr 音频和视频 + 无限滚动

Question

我经历了一堆已经问过/回答过的问题，但它仍然对我不起作用。这是我目前所拥有的。

static.tumblr.com/epkyugq/C0ym8qnir/jquery-1.7.1.min.js

masonry.desandro.com/jquery.masonry.min.js

masonry.desandro.com/js/jquery.infinitescroll.min.js

static.tumblr.com/epkyugq/4fmmajupw/decker.js

我不确定我做错了什么，或者它是否正确以及需要添加一些东西，但如果有人能向我展示如何做的分步教程，我将不胜感激。我是一个视觉型的人，所以我需要查看所有的编码。感谢您抽出宝贵时间阅读本文并感谢您的回答。

Answer 1

您的修复是在无限滚动脚本之外进行的。您应该将其更改为包含它，如下所示：

// other stuff up here
}, function( newElements ) {

    var $newElems = $(newElements).css({
        opacity: 0
    });

    $newElems.imagesLoaded(function () {
        $newElems.animate({
            opacity: 1
        });
        $container.masonry('appended', $newElems, true);
    });

    /* repair video players*/
    $newElems.find('.video').each(function(){
        var audioID = $(this).attr("id");
        var $videoPost = $(this);
        $.ajax({
            url: '/api/read/json?id=' + audioID,
            dataType: 'jsonp',
            timeout: 10000,
            success: function(data){
                $videoPost.html(data.posts[0]["video-player"]);
            }
        });
    });

    /* repair audio players*/
    $newElems.find('.player').each(function(){
        var audioID = $(this).attr("id");
        var $audioPost = $(this);
        $.ajax({
            url: '/api/read/json?id=' + audioID,
            dataType: 'jsonp',
            timeout: 10000,
            success: function(data){
               $audioPost.html(data.posts[0]["audio-player"]);
            }
        });
    });
});

我使用$newElems.find() 是因为我们只想加载页面上的新帖子。如果您只使用$('.video')，您将浏览所有个帖子，包括已经加载的帖子。