2

我正在使用 ajax 添加我的 YouTube iframe（在模态/灯箱层中）。一次一个。由于我正在这样做（并且无法更改），因此我无法在准备好文档时运行 youtube api。该脚本需要在 iframe 存在时附加并运行，才能找到 iframe 的 ID。

第一个 iframe 一切正常。使用 ajax 获取 iframe 时，我还附加了 javascript。

但是：当我关闭那个模态层（我关闭它，我不删除它 - 出于性能原因）并打开另一个带有新视频的层时，我想再次运行 youtube 脚本。现在添加第二个 youtube api 脚本时它不起作用。

注意：当我关闭模式时，我会使用 api 暂停视频。这只适用于第一个 iframe。

我应该怎么办？是否有运行重新初始化 api 的函数？

感谢您尝试帮助 tsturzl，但这不起作用。

我打开一个模式并使用 ajax 加载内容（包含 iframe 和其他元素）。然后我运行 youtube API 并将 ID 设置为 iframe ID。

当我关闭模式时，我运行 player.pauseVideo(); 并暂停视频。模态现在隐藏（未删除，视频暂停），iframe 仍在 html 中，youtube api 的 ID 为“已保存”。

现在我想用另一个 youtube iframe 打开另一个模式（这个也加载了 ajax）。我再次运行 api 并尝试保存该 ID，因此当我关闭（隐藏）该模式时，新视频会暂停，但它不起作用。

知道怎么做吗？

注意：在这些模式中，视频显示在一个预览 div 中，用户可以隐藏/显示 iframe。当他们隐藏它时，视频应该暂停。当 iframe 隐藏时，预览 div 中会显示一个图像。

4

1 回答 1

0

似乎没有，但是您可以自己重新初始化它。看到您没有提供代码，我将在此处参考文档上的代码

初始化你创建“var player;” 这是您使用函数“onYouTubeIframeAPIReady()”创建实例的变量。也许您不是每次创建模态时都重新创建 iframe。

您做模态框的方式可能是将内容存储在javascript中的字符串中。因此，每次关闭它时，div 元素都会消失，因此 youtube API 可能会因为缺少初始化它的元素而出错。

我的猜测是每次打开或关闭模式时都应该创建和删除 iframe（即“播放器”对象）。

不幸的是，我不能确定，我没有代码片段可以作为基础。由于您提供的信息很少。

所以我想要的是这样的：



      var isReady=0;
      var player;
      function onYouTubeIframeAPIReady() {
        isReady=1;
      }

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

      // 5. The API calls this function when the player's state changes.
      //    The function indicates that when playing a video (state=1),
      //    the player should play for six seconds and then stop.
      var done = false;
      function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.PLAYING && !done) {
          setTimeout(stopVideo, 6000);
          done = true;
        }
      }
      function stopVideo() {
        player.stopVideo();
      }
      function onModalOpen(){
        if(isReady==1){
          player = new YT.Player('player', {
            height: '390',
            width: '640',
            videoId: 'u1zgFlCw8Aw',
            events: {
              'onReady': onPlayerReady,
              'onStateChange': onPlayerStateChange
            }
          });
        }
      }
      function onModalClose(){
        player=null;
      }

当然，您需要为每个 iframe 创建一个“播放器”对象。您还需要为每个播放器对象调用 onModalOpen/Close，您可以将其作为参数传递给事件处理程序。

于 2012-09-27T14:45:01.177 回答