播放另一个时,停止任何嵌入的YouTube iframe

时间:2016-12-31 01:50:07

标签: javascript iframe youtube youtube-api youtube-iframe-api

我在我的页面中嵌入了大约10个YouTube iframe,所有这些都有自己的自定义播放/暂停按钮。我已经使用此解决方案开始http://jsfiddle.net/buuuue/dzroqgj0/但我不知道如何调整这段代码来阻止正在播放的其他视频,如果另一个视频开始...

Person.find({"data.dob": "1-2-2016"}, function(err,result) {
        res.json(result)
      });

例如,如果玩家1正在玩,并且玩家3被玩,我希望玩家1停止玩游戏。我也研究过这个解决方案https://stackoverflow.com/a/38405859/1798756,但我想我需要通过JS创建播放器,以便我也可以创建自定义播放/暂停按钮。

提前感谢您的帮助!

1 个答案:

答案 0 :(得分:3)

创建播放器后将它们推入阵列。

    var vids =[];
    player1 = new YT.Player('player1', {
     //stuff
    });
    vids.push(player1);

    player2 = new YT.Player('player2', {
     // stuff
    });
    vids.push(player2);

    ....
    ..
    playerN = new YT.Player('playerN', {
     // stuff
    });
    vids.push(playerN);

每个玩家对象的id都可以通过其a.id属性访问(a本身就是一个对象,id是一个属性(字符串))

现在当用户玩一个给定的玩家时,除了正在播放的玩家之外,你必须暂停所有其他玩家(你在stopVideo中获得的ID)。因为你有id很容易

 function stopVideo(player_id) {
  for(var i=0;i<vids.length;i++){
    if (player_id !=vids[i].a.id)    
      vids[i].stopVideo();
  }
 }

示例: - http://jsfiddle.net/4t9ah1La/

如果您不是通过脚本创建播放器,而只是嵌入iframe,那么this提到的vbence回答就足够了,下面是Jennie建议的改进的演示

示例: - http://jsfiddle.net/fyb7fyw1/

各个原创作者的所有学分