Youtube iFrame API无法控制播放器

I am making a site where I need external controls for an embedded Youtube video.
The problem is that the play button doesn't work when it's inside the onPlayerReady function.

This it the markup:

我正在建立一个网站,我需要外部控件来嵌入Youtube视频。问题是播放按钮在onPlayerReady函数内部时不起作用。这是标记:

<script type="text/javascript" src="https://www.youtube.com/iframe_api"></script>
<div>
   <iframe id="player" width="560" height="315"  src="https://www.youtube.com/embed/08HqRzhqXU0" frameborder="0" allowfullscreen></iframe>
</div>
<div id="play_btn">PLAY</div>

And this is my script:

这是我的剧本:

var player;

function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
            events: {
                'onReady': onPlayerReady,
            }
        });
}

function onPlayerReady(event) {
    var playButton = document.getElementById("play_btn");
    playButton.addEventListener("click", function() {
        player.playVideo();
    });
}

1 个解决方案

#1

You need to include the enablejsapi parameter on the iframe source.

您需要在iframe源上包含enablejsapi参数。