【问题标题】:youtube iframe API does not work on ipad and iphoneyoutube iframe API 在 ipad 和 iphone 上不起作用
【发布时间】:2014-07-16 17:38:08
【问题描述】:

我试图为幻灯片重新创建多个 iframe 示例 detailed here。它可以在所有浏览器中完美运行,包括桌面 safari,除了 iphone 和 ipad。

http://codepen.io/lakshminp/pen/mepIB

Js:

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 players = {}

var YT_ready = (function() {
    var onReady_funcs = [],
        api_isReady = false;
    return function(func, b_before) {
        if (func === true) {
            api_isReady = true;
            for (var i = 0; i < onReady_funcs.length; i++) {
                // Removes the first func from the array, and execute func                                                                                                                     
                onReady_funcs.shift()();
            }
    }
        else if (typeof func == "function") {
            if (api_isReady) func();
            else onReady_funcs[b_before ? "unshift" : "push"](func);
        }
    }
})();


function onYouTubeIframeAPIReady() {
  jQuery(window).bind("load", function() {
    YT_ready(true);
  });
}

YT_ready(function() {
        var identifier = "v9d09JLBVRc";
            players[identifier] = new YT.Player(identifier, {
                events: {
                  'onReady': onPlayerReady,
                    "onStateChange": createYTEvent(identifier)
                }
            });
});

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

// Returns a function to enable multiple events                                                                                                                                                
function createYTEvent(identifier) {
    var player = players[identifier]; // Get cached player instance                                                                                                                            
    return function (event) {
      console.log(event.data);
    }
}

HTML:

<div id="yt-container">
  <iframe width="640" height="480" id="v9d09JLBVRc" class="media-youtube-player" src="//www.youtube.com/embed/v9d09JLBVRc?enablejsapi=1&autoplay=0" frameborder="0" allowfullscreen></iframe>
</div>

【问题讨论】:

    标签: iphone ipad youtube-api youtube-javascript-api


    【解决方案1】:

    根据this

    自动播放、playVideo()、loadVideoById() 等函数和参数并非在所有移动环境中都有效

    在您的 YTReady 函数中,您可以动态加载视频,目前这在 iOS 上是不可能的。

    你也可以试试YouTubeDemoPage,再尝试加载另一个id,你会发现不行。

    您还应该检查this

    【讨论】:

      猜你喜欢
      • 2012-10-15
      • 2015-03-21
      • 2021-07-13
      • 1970-01-01
      • 2016-09-16
      • 2012-09-19
      • 1970-01-01
      • 2012-02-06
      • 2011-12-07
      相关资源
      最近更新 更多