youtube api onPlayerStateChange没有触发

时间:2015-12-07 05:33:06

标签: youtube-api

我在网上查看了所有内容,只看了几年前的答案,但没有一个能帮助我。我看到onYouTubeIframeAPIReady fire,但是当视频播放或结束时我从未看到onPlayerStateChange或onPlayerReady。

<iframe id="ytvideoframe1" width="100%" height="auto" src="https://www.youtube.com/embed/ZHqBp9vbO5E?enablejsapi=1&origin=http://www.earluminator.com"frameborder="0" allowfullscreen ></iframe>    



<script>

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 player;
  function onYouTubeIframeAPIReady() {
                console.log("onYouTubeIframeAPIReady");
        player = new YT.Player('ytvideoframe1', {
        playerVars: { 'controls': 0, 'modestbranding': 1, 'showinfo': 0 },
        events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
        }
    });
    console.log("player1 created - onYouTubeIframeAPIReady");

  }

  function onPlayerReady(event) {
                console.log("onPlayerReady");
        player = new YT.Player('ytvideoframe1', {
        playerVars: { 'controls': 0, 'modestbranding': 1, 'showinfo': 0 },
        events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
        }
    });
  }
function onPlayerStateChange(event) {
        console.log("onPlayerStateChange");
    if ((event.data == YT.PlayerState.PLAYING ) ) {
        console.log("PLAYING");

    }
    if ((event.data == YT.PlayerState.PAUSED ) ) {
        console.log("PAUSED");

    }
    else  {
        console.log("OTHER");

    }
  }

1 个答案:

答案 0 :(得分:0)

您的onPlayerReady未触发,因为与建议的实施here相反,您的onPlayerReady正在使用onReady事件调用自己。好像你复制了onYouTubeIframeAPIReady()代码并忘记进行更改。如上面链接的文档中所述,我建议您更改onPlayerReady实现,如图所示

 // 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
        event.target.playVideo();
      }

因此,你的onPlayerStateChange没有被解雇,因为根据你的代码,它没有到达那里。修复onPlayerReady也可以解决此问题。