onYouTubePlayerAPIReady()未被调用

Question

我有一个加载youtube视频的iframe页面(iframe的src在运行时修改)。我基于Rob W的代码提供了关于这个主题的不同答案

<iframe id="browser" class="browser" scrolling="no" name="navigation"  
src="http://www.youtube.com/embed/nOEw9iiopwI?enablejsapi=1" application="youtube" style="display:  
inline;"></iframe>

当iframe被加载时，执行以下代码:

$('.browser').load(function() {
dispose_ytplayer();
});

调用的函数dispose_ytplayer()是:

function dispose_ytplayer() {
    (function(){
    var s = document.createElement("script");
    s.src = "http://www.youtube.com/player_api";
    var before = document.getElementsByTagName("script")[0];
    before.parentNode.insertBefore(s, before);
     })();
    alert('called yt_dispose');
    var ytIframeplayer;
    function onYouTubePlayerAPIReady() {
        alert('called onYouTubePlayerAPIReady');
        ytIframeplayer = new YT.Player('browser', {
             events: {
                "onStateChange": stopCycle
             }
        });
    }
}

但是第二个警报("called onYouTubePlayerAPIReady")从未被调用，我的chrome console.log显示了这个错误消息从www-embed_core_module- vflnmugqq.com .js:26:

不安全的JavaScript试图从URL为http://www.youtube.com/embed/nOEw9iiopwI?enablejsapi=1的框架访问URL为http://mysite.com的框架。域、协议和端口必须匹配。

任何想法?

Answer 1

onYouTubePlayerAPIReady应该在window对象上。

试题:

window.onYouTubePlayerAPIReady = function() {
        alert('called onYouTubePlayerAPIReady');
        ytIframeplayer = new YT.Player('browser', {
             events: {
                "onStateChange": stopCycle
             }
    });
}

Answer 2

似乎你没有正确关闭函数。

最后一个}关闭onYouTubePlayerAPIReady()，而不是dispose_ytplayer()。

固定代码:

function dispose_ytplayer() {
    (function(){
        var s = document.createElement("script");
        s.src = "http://www.youtube.com/player_api";
        var before = document.getElementsByTagName("script")[0];
        before.parentNode.insertBefore(s, before);
    })();
    alert('called yt_dispose');
    var ytIframeplayer;
    function onYouTubePlayerAPIReady() {
        alert('called onYouTubePlayerAPIReady');
        ytIframeplayer = new YT.Player('browser', {
            events: {
                "onStateChange": stopCycle
            }
        });
    }
}