Javascript 如何在不链接到播放列表的情况下播放两个Youtube视频？

我对Javascript非常陌生。我在这里嵌入了一个youtube iframe：

使用此文档：

我想第二个视频播放，循环后，第一个是完成。如果我尝试将视频id链接/设置到Youtube播放列表，则无法设置特定的视频参数

我假设需要设置一个事件侦听器和函数，以便在播放YT.PlayerState.end（或0）时触发，但不知道如何执行此操作

更新：以下是我为玩家使用的当前代码：

<script>
  // 2. This code loads the IFrame Player API code asynchronously.
  var tag = document.createElement('script');
  tag.src = "http://www.youtube.com/player_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  // 3. This function creates an <iframe> (and YouTube player)
  //    after the API code downloads.
  var player;
  function onYouTubePlayerAPIReady() {
    player = new YT.Player('player', {
      height: '258',
      width: '406',
      videoId: 'MsTQNZmq5Pk',
      playerVars: { 'autoplay': 0, 'rel': 0, 'showinfo': 0, 'egm': 0, 'showsearch': 0, },
      events: {
        'onStateChange': onPlayerStateChange,
      }
    });
  }

  // 4. The API will call this function when the video player is ready.     
    function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.ENDED) {
        player.stopVideo();
        player.videoId = 'c5dTlLk5_x8';
        player.playVideo();
        }
    }


</script>

// 2. 此代码异步加载IFrame播放器API代码。
var tag=document.createElement（'script'）；
tag.src=”http://www.youtube.com/player_api";
var firstScriptTag=document.getElementsByTagName（'script'）[0]；
firstScriptTag.parentNode.insertBefore（标记，firstScriptTag）；
// 3. 此函数用于创建（和YouTube播放器）
//API代码下载后。
var播放器；
函数onYouTubePlayerAPIReady（）{
player=新的YT.player（'player'{
高度：'258'，
宽度：'406'，
videoId:'MsTQNZmq5Pk'，
PlayerBars:{'autoplay'：0，'rel'：0，'showinfo'：0，'egm'：0，'showsearch'：0，}，
活动：{
“onStateChange”：onPlayerStateChange，
}
});
}
// 4. 当视频播放器准备就绪时，API将调用此函数。
函数onPlayerStateChange（事件）{
如果（event.data==YT.PlayerState.end）{
player.stopVideo（）；
player.videoId='c5dTlLk5_x8'；
player.playVideo（）；
}
}

在api网站的第一个代码列表中，此事件可能会帮助您：

  function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING && !done) {
      setTimeout(stopVideo, 6000);
      done = true;
    }
  }

您可以将其更改为类似的内容（恐怕未经测试）：

在我看来，这是最符合逻辑的，但我不确定是否可以在一个播放器实例中播放不同的视频。恐怕我从未见过你的情景

---

编辑：您可以尝试创建播放器的新实例。所以基本上你只需要创建一个新的播放器，它将播放第二个视频：

 function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.ENDED) {
      player.stopVideo();

      player = new YT.Player('player', {
         height: '258',
         width: '406',
         videoId: 'some id',
         playerVars: { 'autoplay': 0, 'rel': 0, 'showinfo': 0, 'egm': 0, 'showsearch': 0, },
         events: {
           //'onStateChange': onPlayerStateChange, // not add this line because it would again create a new player after the second has stopped I guess!
         }
      });

      player.playVideo();
    }
  }

---

在api网站上的第一个代码列表中，此事件可能会帮助您：

  function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING && !done) {
      setTimeout(stopVideo, 6000);
      done = true;
    }
  }

您可以将其更改为类似的内容（恐怕未经测试）：

在我看来，这是最符合逻辑的，但我不确定是否可以在一个播放器实例中播放不同的视频。恐怕我从未见过你的情景

---

编辑：您可以尝试创建播放器的新实例。所以基本上你只需要创建一个新的播放器，它将播放第二个视频：

 function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.ENDED) {
      player.stopVideo();

      player = new YT.Player('player', {
         height: '258',
         width: '406',
         videoId: 'some id',
         playerVars: { 'autoplay': 0, 'rel': 0, 'showinfo': 0, 'egm': 0, 'showsearch': 0, },
         events: {
           //'onStateChange': onPlayerStateChange, // not add this line because it would again create a new player after the second has stopped I guess!
         }
      });

      player.playVideo();
    }
  }

---

我在我的网站上实现了这一点，首先可以停止当前的视频播放，然后使用Youtube API中的loadVideoById（）函数加载新视频

 function swapVideo() {     
    player.stopVideo();
    player.loadVideoById(youtube_id);
 }

---

我在我的网站上实现了这一点，首先可以停止当前的视频播放，然后使用Youtube API中的loadVideoById（）函数加载新视频

 function swapVideo() {     
    player.stopVideo();
    player.loadVideoById(youtube_id);
 }

---

嘿，皮姆！谢谢你的建议。我已经对此进行了测试，它会导致第一个视频循环，而忽略更改videoId的尝试。我还在想办法解决这个问题。我已经将我正在使用的代码添加到我的第一条评论中以供参考。嘿，pimvdb！谢谢你的建议。我已经对此进行了测试，它会导致第一个视频循环，而忽略更改videoId的尝试。我还在想办法解决这个问题。我已经将我正在使用的代码添加到我的第一条注释中以供参考。