Youtube iframe api没有触发YouYouTubeIframeAPIReady [英] Youtube iframe api not triggering onYouTubeIframeAPIReady

问题描述

我一直在与youtube iframe api争夺很长一段时间。不知何故，方法 onYouTubeIframeAPIReady 并不总是被触发。

I've been battling with the youtube iframe api for quite some time now. Somehow the method onYouTubeIframeAPIReady is not always triggered.

从症状来看，它似乎是一个装载问题。检查员没有显示错误。

From the symptoms it seems a loading problem. No errors are shown in the inspector.

这是我的代码：

<div id="player"></div>
          <script>
            videoId = 'someVideoId';
            var tag = document.createElement('script');
            tag.src = "//www.youtube.com/iframe_api";
            var firstScriptTag = document.getElementsByTagName('script')[0];
            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
          </script>

JS

（最后调用）我尝试将代码放在上面的脚本之后，结果是一样的。）

JS

(called at the end of the page. I tried to place the code right after the above script and the result was the same.)

var isReady = false
  , player
  , poster
  , video;

$(function () {
$('.js-play').click(function (e) {
    e.preventDefault();
    interval = setInterval(videoLoaded, 100);
  });
});
function onYouTubeIframeAPIReady() {
  console.log(videoId)
  player = new YT.Player('player', {
    height: '445',
    width: '810',
    videoId: videoId,
    events: {
      'onReady': onPlayerReady//,
      //'onStateChange': onPlayerStateChange
    }
  });
}

function onPlayerReady(event) {
  isReady = true;
  console.log("youtube says play")
}

function videoLoaded (){
  if (isReady) {
      console.log("ready and play")
      poster.hide();
      video.show();

      $('body').trigger('fluidvideos');

      player.playVideo();
      clearInterval(interval);
  } 
}

问题是有时候什么都没有被 console.log 并且没有任何反应。

The problem is that sometimes nothing gets printed by the console.log and nothing happens.

在手机上，这种情况一直都在发生。有什么想法？

On mobile phones this happens all the time. Any ideas?

推荐答案

这不是超时问题，您不需要手动触发此功能。

It is not a timeout issue, and you should not need to fire this function manually.

确保你的 onYouTubeIframeAPIReady 函数在全局级别可用，而不是在另一个函数中嵌套（隐藏）。

Make sure your onYouTubeIframeAPIReady function is available at the global level, not nested (hidden away) within another function.

这篇关于Youtube iframe api没有触发YouYouTubeIframeAPIReady的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！