YouTube，在PlayerReady上，使用for循环获取数组中与单击箭头位置匹配的视频ID并播放

YouTube, onPlayerReady, use for loop to get the Video ID in the array that matches the click arrow position and play

本文关键字：位置 的视频 播放 ID 单击 使用 PlayerReady for 循环 YouTube 数组      更新时间：2023-09-26

我有以下小提琴：http://jsfiddle.net/inkedraskal/cyhyjht5/3/

在小提琴中，你会看到你可以通过点击单个视频来播放和暂停它们（播放一个，如果你点击另一个，它将停止当前视频并播放你点击的内容）。

我想不出的是如何让自定义播放按钮工作。我有下面的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（）函数：

小提琴

那里有新的代码：

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

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

初始代码的问题是event.target包含一个视频，并且函数循环页面中的所有视频，所以不需要在里面写更多的循环。

从youtubeapi，你甚至可以使用这个功能来处理视频：

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

ytplayer将具有与event.target相同的属性，并且您有免费使用的视频ID

相关文章：