下一个开始播放时，暂停页面上的所有其他Youtube视频

Question

我在Shopify的收藏页上设置了一个视频部分，其中包括一个替换每个产品图像的视频。

我需要一次播放一个视频，而不能同时播放两个视频。当我单击当前视频播放时，所有正在播放的先前视频都应暂停。我该怎么办？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
</script>
<script type="text/javascript" src="http://www.youtube.com/player_api"></script>
<div class="video_wrapper video_wrapper_full js-videoWrapper">
  <iframe class="videoIframe js-videoIframe yt_players" id="player{{ forloop.index }}" src="http://www.youtube.com/embed/erDxb4IkgjM?rel=0&wmode=Opaque&enablejsapi=1;showinfo=0;controls=0" frameborder="0" allowTransparency="true" allowfullscreen></iframe>
  <button class="videoPoster js-videoPoster"></button>
</div>

players = new Array();

function onYouTubeIframeAPIReady() {
  var temp = $("iframe.yt_players");

  for (var i = 0; i < temp.length; i++) {
    var t = new YT.Player($(temp[i]).attr('id'), {
      events: {
        'onStateChange': onPlayerStateChange
      }
    });
    players.push(t);
  }
}

onYouTubeIframeAPIReady();

function onPlayerStateChange(event) {
  if (event.data == YT.PlayerState.PLAYING) {
    var temp = event.target.a.src;
    var tempPlayers = $("iframe.yt_players");
    for (var i = 0; i < players.length; i++) {
      if (players[i].a.src != temp) players[i].stopVideo();
    }
  }
}