Question

Youtube iframe API有一个用于检测视频结束的事件。如果与嵌入的播放列表一起使用，则此事件会在每个视频后触发。我希望只检测播放列表中最后一个视频的结尾。

这是我的尝试：

if (event.data == YT.PlayerState.ENDED && currentIndex == playlist.length - 1 ){ 
    alert('Playlist finished.');
}

这个问题会引发两次。在播放列表中倒数第二个视频结束时，播放器状态为ENDED，播放列表索引增加1，因此触发得太早。它还会在播放列表中最后一个视频结束时触发，这是唯一的预期结果。

Answer 1

您应该仅在视频开始播放时设置currentIndex值。这帮助我实现了同样的目标：

function onPlayerStateChange(event) {

    if (event.data == YT.PlayerState.PLAYING) {
        currentIndex = event.target.getPlaylistIndex();
    }

    if (event.data == YT.PlayerState.ENDED) {
        if (currentIndex == (playlist.length-1)) {
            console.log('end playlist');
        }
    }
}

Answer 2

我知道回答这个问题已经很晚了，但我一直在寻找答案，我发现了这种笨拙的方式。

var isended=0; 
function testifover(){
if(isended==1) { // Did the state change while we delayed 5 seconds
// Whatever you wanted to do at the end of the playlist here.
}
}
function onPlayerStateChange(event) {
  switch (event.data) {
    case YT.PlayerState.UNSTARTED:
      console.log('unstarted');
      break;
    case YT.PlayerState.ENDED:
isended=1;
   var myVar = setTimeout(function(){testifover()} , 5000);  // Delay 5 seconds to make sure we aren't loading another video
// and then do whatever if we really are at the end of the playlist. 
      break;
    case YT.PlayerState.PLAYING:
    isended=0; // we started playing another vid in the playlist
      break;
    case YT.PlayerState.PAUSED:
      console.log('paused');
      break;
    case YT.PlayerState.BUFFERING:
   isended=0; // we started buffering another video in the playlist
      break;
    case YT.PlayerState.CUED:
      console.log('video cued');
      break;
      }
    }

    //     On state change fires and we wait 5 seconds and make sure that hasn't changed to buffering or playing or we kill the player.

Youtube iframe API - 检测播放列表的结尾

2 个答案: