YouTube API - onPlayerStateChange

Question

我将YouTube API与Cyclone Slider结合使用。目标是在YouTube开始播放后暂停幻灯片播放。我使用下面的代码很好地运作：

＆＃13;

＆＃13;

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

<script>
var player;
function onYouTubePlayerAPIReady() {
    player = new YT.Player('video', {
      events: {
        'onStateChange': onPlayerStateChange
      }
    });
}

function onPlayerStateChange(event) {
    if(event.data === 1) {
        $(".cycle-slideshow").cycle('pause');
    }

    if(event.data === 2) {
        $(".cycle-slideshow").cycle('resume');
    }
}
</script>

＆＃13;

＆＃13;

＆＃13;

但是，如果我刷新页面，它似乎才有用。如果我在页面之间导航并返回主页，它将不再有效。

为什么会出现这种情况的任何建议？我已经尝试了一些我在谷歌上找到但却无法工作的建议。我在这个上有点迷失。

非常感谢任何帮助。

Answer 1

尝试以下代码，它适用于我 -

function loadYouTube(targetId){
    ytplayer = new YT.Player(targetId, {
        events: {
            'onStateChange': function(event){
                /** YouTube API
                        -1 (unstarted)
                        0 (ended)
                        1 (playing)
                        2 (paused)
                        3 (buffering)
                        5 (video cued)
                 **/
                if (event.data == 1) {
//do your work here
                }
                console.log(event.data)
            }
        }    
    });
}