api - Youtube iframe API出现问题

Question

我目前有一个博客，当您使用youtube iframe加载页面时会播放背景音乐:

<iframe id="background-music" width="0" height="0" src="https://www.youtube.com/embed/VOR8reYWvx8?rel=1&autoplay=1&enablejsapi=1" xframeborder="0" allowfullscreen></iframe>

我也手动导入了youtube iframe API:

<script src="http://url_to_script/iframe_api.js"></script>

我的博客上还有其他歌曲，每当我在其中播放其他歌曲之一时，我都想暂停背景歌曲。按照 https://developers.google.com/youtube/iframe_api_reference#Examples上的说明，我有以下代码，但它根本不起作用。

$(".tumblr_audio_player").contents().find('.play_button').click(function() 
                console.debug(YT);

                player = new YT.player("background-music", {
                    events: {
                      'onReady': function() { console.log("player is ready") },
                      'onStateChange': function() { console.log("player has changed state"); }
                    }
                });
                player.stopVideo();

我不确定自己在做什么错。我不知道是否需要onReady和onStateChange(我不需要它们)，但是如果没有第二个对象参数，它就无法工作，因此我不确定该怎么做。

Answer 1

好吧，我知道发生了什么事。该代码大部分是正确的，但是，初始化YT.Player对象需要花费时间，而这正是onReady回调的目的。

它可以确保在执行任何操作之前初始化YT对象。如果将pauseVideo放在onReady回调中，它将正常工作。因此，要回答我的原始问题，onReady绝对必要:

player = new YT.Player("background-music", 
{   events: {
        onReady: function() {
            player.stopVideo();
        }
    }
});