在嵌入youtube播放器时收听

Question

有办法知道youtube播放器何时成功嵌入吗？我正在使用iframe嵌入，我想在玩家加载后做一些操作。

Answer 1

我假设您谈论的是包含iFrame嵌入代码本身，而不是使用javascript嵌入它？（无论哪种方式，都没有太大区别。）为此，您需要使用YouTube iFrame javascript库，以便绑定到iFrame并了解其状态。

要加载库，请使用以下代码：

var tag = document.createElement('script');
tag.src = "//www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

当iFrame javascript库成功注入时，它将调用onYouTubeIframeAPIReady，因此如果您定义了该函数，您就可以知道iFrame绑定支持何时准备就绪。在该函数中，您需要为您的iframe:设置一个YT.Player对象

  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', { // the first argument is the id of your iframe
      events: {
        'onReady': onPlayerReady
      }
    });
  }

onReady回调绑定到一个名为onPlayerReady的函数，因此最后一步是定义该函数：

function onPlayerReady() {
     alert('iframe is embedded and player is loaded!');
}

这里有一个要演示的jsfiddle。