0

在使用 YouTube Frame API 时，我从 Google 文档中获取了示例代码，它会在 6 秒后暂停传递给 iframe 的视频：

var tag = document.createElement('script');

  tag.src = "https://www.youtube.com/iframe_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {

      videoId: 'M7lc1UVf-VE',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });

  }

  function onPlayerReady(event) {
    event.target.playVideo();
  }

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

这一切都很好而且很花哨，但是我在另一个以 iframe 为目标的 div 中加载了视频，并且它们不响应此事件侦听器（即它们在 6 秒后继续播放）。为什么是这样？它仍然不是同一个 iframe 吗？查看页面源代码时，id 和 name 似乎已签出。

编辑：刚刚注意到在运行 Inspect Element 时，iframe 没有改变，即源代码中的视频仍然与初始视频相同，而不是新加载的视频。一个线索，但我现在有点困惑。

4

1 回答 1

0

“播放器”是附加 iframe 的位置

player = new YT.Player('player', {

像这样称呼它：

video = document.getElementById('iFrameID'); //JQuery would be $("#iFrameID");
player = new YT.Player(video, {

如果您希望一次控制多个视频，则需要尝试使用多个 YT.Player 对象或运行，也许您可​​以使用类而不是 ID。

于 2014-02-11T04:24:14.423 回答