javascript - 使用 Youtube 播放器的 onStateChange

Question

我试图使用onStateChangeYoutube 视频的属性，但我无法让它工作。我搜索了很多，但无法真正理解它是如何工作的。这是我尝试过的代码，我添加了一个没有被调用的console.log。有人能帮我吗？

这是我的代码：

    <script type="text/javascript">
        function onYouTubePlayerReady(playerId) {
            var player = document.getElementById("YTplayer");
            player.addEventListener("onStateChange", "onplayerStateChange");
        }

        function onplayerStateChange(newState) {
            console.log('test');
        }
    </script>
        <object style="height: 390px; width: 640px">
            <param name="movie" value="http://www.youtube.com/v/u1zgFlCw8Aw?version=3">
            <param name="allowFullScreen" value="true">
            <param name="allowScriptAccess" value="always">
            <embed 
                src="http://www.youtube.com/v/u1zgFlCw8Aw?version=3" 
                type="application/x-shockwave-flash" 
                allowfullscreen="true" 
                allowScriptAccess="always" 
                width="640" height="390"
                id="YTplayer">
        </object>

Answer 1

您必须在 playerapiid 参数中定义 id 或在 onYouTubePlayerReady 回调中使用给定的

<object style="height: 390px; width: 640px">
        <param name="movie" value="http://www.youtube.com/v/u1zgFlCw8Aw?version=3&playerapiid=YTplayer">
        <param name="allowFullScreen" value="true">
        <param name="allowScriptAccess" value="always">
        <embed 
            src="http://www.youtube.com/v/u1zgFlCw8Aw?version=3&playerapiid=YTplayer" 
            type="application/x-shockwave-flash" 
            allowfullscreen="true" 
            allowScriptAccess="always" 
            width="640" height="390"
            id="YTplayer" />
</object>