无法获取youtube iframe和youtube播放器代码以进行对话

时间:2018-07-26 19:21:24

标签: jquery youtube youtube-api

我正在尝试同时嵌入YouTube视频和youtube API的一些代码,以便为视频创建悬停事件。不过,我在将iframe与播放器代码链接时遇到了麻烦。有人知道我在做什么错吗?

html:

<iframe id="playerLibrary" class="playerLocation" width="560" height="315" src="https://www.youtube.com/embed/YT2ZOD32lWw?rel=0&amp;showinfo=0&enablejsapi=0" enablejsapi="1" frameborder="0" allowfullscreen></iframe>

jquery:

var tag = document.createElement('script');

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

  var player3;

  function onYouTubeIframeAPIReady() {

    player3 = new YT.Player('playerLibrary', {
      events: {
        'onReady': onPlayerReady,
        //'onStateChange': onPlayerStateChange
      },
      playerVars: {

      }
    });
}

  function onPlayerReady(event) {
   console.log('ready'); //never fires
  }

1 个答案:

答案 0 :(得分:0)

当我将onReady绑定从onPlayerReady更改为onPlayerReady(event)时,我开始为我工作。

var tag = document.createElement('script');

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

  var player3;

  function onYouTubeIframeAPIReady() {

    player3 = new YT.Player('playerLibrary', {
      events: {
        'onReady': onPlayerReady(event)
      },
      playerVars: {

      }
    });
}

function onPlayerReady(event) {
 console.log('ready');
}
<iframe id="playerLibrary" class="playerLocation" width="560" height="315" src="https://www.youtube.com/embed/YT2ZOD32lWw?rel=0&amp;showinfo=0&enablejsapi=1" enablejsapi="1" frameborder="0" allowfullscreen></iframe>