来自 YT 的多部电影答案

【问题标题】：multiple movies from YT来自 YT 的多部电影
【发布时间】：2017-04-26 21:29:56
【问题描述】：

我有这样的代码：

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

var player_rfIuA8wXD8c;

function onYouTubePlayerAPIReady() {
  player_YdfNuwMhMg4 = new YT.Player('player_rfIuA8wXD8c', {
    height: '435',
    width: '480',
    videoId: 'rfIuA8wXD8c',
    playerVars: {
      'start': 56,
      'autoplay': 0,
      'controls': 1,
      'playlist': 'rfIuA8wXD8c',
      'loop': 1
    }

  });
}

var player_HmZKgaHa3Fg;

function onYouTubePlayerAPIReady() {
  player_HmZKgaHa3Fg = new YT.Player('player_HmZKgaHa3Fg', {
    height: '480',
    width: '640',
    videoId: 'HmZKgaHa3Fg',
    playerVars: {
      'start': 0,
      'autoplay': 0,
      'controls': 1,
      'playlist': 'HmZKgaHa3Fg',
      'loop': 1
    }

  });
}

<div class="content">
  <div id="player_rfIuA8wXD8c" class="swipebox" rel="yt"></div>
  <span>test text</span>
  <div id="player_HmZKgaHa3Fg" class="swipebox" rel="yt"></div>
</div>

...并且只在最后一部电影工作（HmZKgaHa3Fg）。我尝试了不同的方法，但我仍然无法拍摄第一部电影。有没有人有类似的问题，可以建议我做错了什么？感谢大家的帮助

【问题讨论】：

我在YouTubePlayerAPIReady上定义了两次相同的方法;)

标签： javascript html youtube youtube-api

【解决方案1】：

您已经声明了两个函数onYouTubePlayerAPIReady()，您只需要实例化一个并在其中声明两个YT.Player：

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

var players = new Array();
var players_attr = new Array();

players_attr["player_rfIuA8wXD8c"] = {
  height: '435',
  width: '480',
  videoId: 'rfIuA8wXD8c',
  playerVars: {
    'start': 56,
    'autoplay': 0,
    'controls': 1,
    'playlist': 'rfIuA8wXD8c',
    'loop': 1
  }

};

players_attr["player_HmZKgaHa3Fg"] = {
  height: '480',
  width: '640',
  videoId: 'HmZKgaHa3Fg',
  playerVars: {
    'start': 0,
    'autoplay': 0,
    'controls': 1,
    'playlist': 'HmZKgaHa3Fg',
    'loop': 1
  }
};

function onYouTubeIframeAPIReady() {
  for (key in players_attr) {
    players[key] = new YT.Player(key, players_attr[key]);
  }
}

<div class="content">
  <div id="player_rfIuA8wXD8c" class="swipebox" rel="yt"></div>
  <span>test text</span>
  <div id="player_HmZKgaHa3Fg" class="swipebox" rel="yt"></div>
</div>

【讨论】：

效果很好，谢谢。昨天累了，不知道怎么定义两次相同的方法

【解决方案2】：

放弃那个。

会是这条线吗？

player_YdfNuwMhMg4 = new YT.Player('player_rfIuA8wXD8c', {

你有 player_YdfNuwMhMg4，但我在其他任何地方都看不到？

【讨论】：