Javascript YouTube，onPlayerReady，使用for loop获取数组中与单击箭头位置匹配的视频ID并播放

我有以下几把小提琴：

在fiddle中，您将看到您可以通过单击单个视频来播放和暂停它们（播放一个视频，如果您单击另一个视频，它将停止当前视频并播放您单击的视频）

我不明白的是如何让自定义播放按钮工作。我在小提琴中有以下for循环，但我猜它与数组中的位置不匹配。如果单击第三个“播放”范围，则应播放第三个视频：

function onPlayerReady(event) {
  for (var i = 0; i < players.length; i++) {
    // if (players[i].getVideoUrl() != temp) players[i].stopVideo();

    for (var q = 0; q < ytPlayButtons.length; q++) {
      playButton = document.getElementById(ytPlayButtons[q]);
      playButton.addEventListener("click", function() {
        console.log(playButton);
        players[i].playVideo();
      });
    }
  }
}

函数onPlayerReady（事件）{
对于（变量i=0；i

您好，我已经编辑了您的小提琴并重新制作了onPlayerReady（）函数：

新代码如下：

var videoCount = 1;
function onPlayerReady(event) {
  $("#play-"+videoCount).on("click", function() {
    console.log("play-"+videoCount);
    event.target.playVideo();
  });
  videoCount++;
}

这是最简单的方法。 您应该获取视频的id，然后以某种方式将其链接到按钮

初始代码的问题是

event.target

包含一个视频，函数循环页面中的所有视频，因此不需要在其中写入更多的循环

从中，您甚至可以使用此功能处理视频：

function onYouTubePlayerReady(playerId) {
  ytplayer = document.getElementById("myytplayer");
}

---

ytplayer将拥有event.target的相同属性，您可以免费使用videoID

这太棒了，也感谢您的解释