动态更改Youtube iframe playerVars

Question

我有一个使用Youtube Iframe API的网页,我设法使用以下代码行更改videoId:

player.loadVideoById(videoId)

但是为了使视频循环,videoId和播放列表必须匹配,因此我还需要更改playerVars对象内的播放列表参数.有人能告诉我一个简单的方法吗？

这是原始代码:

var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: 'M7lc1UVf-VE',
playerVars: { 
    'loop' : 1,
    'playlist': 'M7lc1UVf-VE'
    },
events: {
  'onReady': onPlayerReady,
  'onStateChange': onPlayerStateChange
    }
 });
}

我尝试设置如下所示的变量并动态更改它,因为我执行了loadVideoById:

player.loadVideoById(videoId) 
currentVideoId = videoId

和

var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: currentVideoId,
playerVars: { 
    'loop' : 1,
    'playlist': currentVideoId
    },
events: {
  'onReady': onPlayerReady,
  'onStateChange': onPlayerStateChange
    }
 });
}

Answer 1

使用.loadPlaylist()指定播放列表和视频（播放列表内）的（数字）索引，而不是视频 ID。

player.loadPlaylist({list:String,
                 listType:String,
                 index:Number,
                 startSeconds:Number,
                 suggestedQuality:String}):Void

该函数加载指定的列表并播放它。该列表可以是播放列表、搜索结果源或用户上传的视频源。

• 可选listType属性指定您正在检索的结果源的类型。有效值为playlist、search和user_uploads。默认值为playlist。

• 必需的list属性包含一个键，用于标识 YouTube 应返回的特定视频列表。

...

¹

请参阅此示例小提琴，其中两个不同播放列表中的两个视频加载到函数中clickEventHandler()（取决于单击的列表项的id属性值）。

player.loadPlaylist({
    list: 'PLUdAMlZtaV11U9AtszkMh0bpRqM4dtlDC',
    index: 7
  });