检索特定播放列表缩略图时,它无法获取视频的视图和描述

时间:2014-12-24 07:01:37

标签: javascript jquery json api youtube

我正在尝试检索用户的特定播放列表缩略图,但在这里我卡住了 - 它没有得到视频的视图和描述。我想仅允许在我的网站中播放视频。

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.js'></script>

<script type='text/javascript'>//<![CDATA[ 


   $(window).load(function() {
   function LoadVids(startindex) {
     if (typeof startindex === "undefined" || startindex === null) startindex = 1;
     var playListURL = 'http://gdata.youtube.com/feeds/api/playlists/PL3B8939169E1256C0?orderby=published&v=2&alt=json&&start-index=' + startindex;
     var videoURL = 'http://www.youtube.com/watch?v=';
     $.getJSON(playListURL, function(data) {
       var list_data = "";
       $.each(data.feed.entry, function(i, item) {
         var feedTitle = item.title.$t;
         var feedURL = item.link[1].href;
         var fragments = feedURL.split("/");
         var videoID = fragments[fragments.length - 2];
         var vid = item.media$group.yt$videoid.$t;
         var url = videoURL + videoID;
         var vidtitle = item.title.$t;
         var thumb = "http://img.youtube.com/vi/" + videoID + "/default.jpg";
         list_data += ' < img alt = "'+ feedTitle+'"
         src = "'+ thumb +'"
         ' + ' - ' + vidtitle + '
         ';
       });
       $(list_data).appendTo(".cont");
     });
   }

   //
   $(document).ready(function() {
     LoadVids(1); // call on load more click
   });
 }); //
</script>   

</head>
<body>   
</body>
</html>

1 个答案:

答案 0 :(得分:0)

你的ajax似乎还可以。但我在你的代码中找不到任何“播放功能”。为此,我建议你jquery.tubeplayer:

http://www.tikku.com/jquery-youtube-tubeplayer-plugin

小例子:

 playVideo: function (events) {
        var self = this;
        var that = $(events.currentTarget);
        var videoId = that.parents('.videopreview').find('.youtubeimage').attr('data-link');
        that.parents('.videopreview').find('.youtubeimage').hide();
        that.parents('.videopreview').find('.playicon').css({
            "z-index": -20,
        });

        that.parents('.videopreview').find('.playvideo').tubeplayer({
            width: 279, // the width of the player
            height: 200, // the height of the player
            allowFullScreen: "true", // true by default, allow user to go full screen
            initialVideo: videoId, // the video that is loaded into the player
            autoPlay: true,
            preferredQuality: "default", // preferred quality: default, small, medium, large, hd720                  
        });
    },

“data-link”是youtube视频ID: JavaScript REGEX: How do I get the YouTube video id from a URL?

在你的剧本中:

$.each(data.feed.entry, function(i, item) {
var feedTitle = item.title.$t;
var feedURL = item.link[1].href;
var fragments = feedURL.split("/");
var videoID = fragments[fragments.length - 2];
var vid = item.media$group.yt$videoid.$t;
var url = videoURL + videoID;
var vidtitle = item.title.$t;
var description=item.media$group.media$description.$t;
var views=item.yt$statistics.viewCount;
var thumb = "http://img.youtube.com/vi/"+ videoID +"/default.jpg";
list_data += '
<img alt="'+ feedTitle+'" src="'+ thumb +'"' + ' - ' + vidtitle + '
';
});
$(list_data).appendTo(".cont"); 
});