BackboneJS 如何在视图中加载 Youtube Iframe答案

【问题标题】：BackboneJS How to load Youtube Iframe in viewBackboneJS 如何在视图中加载 Youtube Iframe
【发布时间】：2014-06-22 21:04:23
【问题描述】：

我有一个 Backbone 应用程序，我有一个要在其中显示 youtube 播放器的视图：

所以在我看来，afterRender - 我这样做了：

afterRender: function() {
              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() {
                player = new YT.Player('vid', {
                  height: '390',
                  width: '640',
                  videoId: '',
                  events: {
                    'onReady': onPlayerReady,
                    'onStateChange': onPlayerStateChange
                  }
                });
              }

              function onPlayerReady(event) {
                event.target.playVideo();
              }

              var done = false;
              function onPlayerStateChange(event) {
                if (event.data == YT.PlayerState.PLAYING && !done) {
                  setTimeout(stopVideo, 6000);
                  done = true;
                }
              }
              function stopVideo() {
                player.stopVideo();
              }
}

但它没有渲染任何东西，但我也没有收到错误，在我的控制台中我可以看到 Youtube API 已加载......那么我在这里做错了什么？

请帮忙..

【问题讨论】：

标签： backbone.js youtube youtube-api

【解决方案1】：

通过改变

function onYouTubeIframeAPIReady() {
 // ...
}

进入

window.onYouTubeIframeAPIReady = function() {
 // ...
}

现在可以了！在这里找到线索Youtube iframe api not triggering onYouTubeIframeAPIReady

【讨论】：

【解决方案2】：

查看这个相关问题：Youtube iframe api not triggering onYouTubeIframeAPIReady

我认为问题在于您的 onYouTubeIframeAPIReady 函数需要全局声明，而不是嵌套在另一个函数中。（在您的代码中，它仅在 afterRender 方法的范围内定义。）

【讨论】：