Javascript 未调用YouTube iframe API changeState

我试图在视频播放结束后使用启动事件。包含YouTube视频的iframe与文档一起加载，并且在URL中具有enablejsapi=1参数，如下所示：

<iframe id="myytplayer" src="http://www.youtube.com/v/8mmd_eHYmMY?enablejsapi=1&playerapiid=ytplayer&version=3" allowfullscreen="" frameborder="0"></iframe>

我还必须加载以下资源，以使就绪警报显示

<script src="http://www.youtube.com/player_api" type="text/javascript"></script>

---

我已经创建了一个JSFIDLE。

您不能像在旧的javascript API中那样，只向DOM元素添加事件侦听器；使用iframeapi，您必须首先基于DOM元素创建YT.player对象，然后在那里添加事件侦听器。大概是这样的：

function onYouTubeIframeAPIReady() {
    ytplayer = YT.Player("myytplayer", {
    events: {
      'onStateChange': onPlayerStateChange
    }
}

另外，通过脚本标记加载player_api时要小心一点。。。无法保证onYouTubeIframeAPIReady函数在完全加载时会被定义。在定义就绪函数之前，最好执行以下操作：

<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);

---

看这里，这可能是解决方案：

<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);