使用Youtube播放器的onStateChange

Question

我试图使用Youtube视频的onStateChange属性，但我无法使用它。我搜遍了很多但却无法理解它是如何工作的。这是我尝试的代码，我添加了一个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 pramameter中定义id或在onYouTubePlayerReady回调中使用给定的id

<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>