隐藏div后如何停止Youtube视频

Question

我正在尝试使用隐藏/显示不同divs的功能来构建一个显示不同页面的网站。这些页面中有一个是YouTube的视频，我试图找出隐藏div时停止视频的方法。现在，如果您切换到另一页/格，视频将一直在后台播放（您可以听到声音）。

我已将此代码添加到HTML正文的末尾

<script>
  var tag = document.createElement('script');
  tag.src = "//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');
  }
</script>

和这对javascript：

  if ($('.ep1').is(':visible')) {
    player.playVideo();
   }
else {
    player.pauseVideo();
   };
});

但是似乎没有任何效果。您可以在此处检查小提琴（单击图像转到“ ep1”，开始播放视频，然后使用菜单返回到“ episodios”：https://jsfiddle.net/Santos1600/qu8ejwsm/6/

有什么想法吗？

Answer 1

您需要为页面上的每个视频创建以“ new YT.Player”开头的变量。然后，您可以在想要的视频上调用“暂停”方法。