Question

播放器初始化和视频播放后，必须在dom树上移动pleer。之后更新iframe并执行事件监听器onReady并且事件监听器onStateChange停止。我试图删除并添加事件监听器onStateChange，但方法player.removeEventListener（'onStateChange'，'onPlayerStateChange'）在移动播放器之前不起作用。此问题的示例：

<html>
<head></head>
<body>
    <div id="player"></div>
    <script type="text/javascript">
        var tag = document.createElement('script');
        tag.src = "https://www.youtube.com/iframe_api";
        var firstScriptTag = document.getElementsByTagName('script')[0];
        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

        var player, pauseCounter = 0;

        function onYouTubeIframeAPIReady() {
            player = new YT.Player('player', {
                height: '390',
                width: '640',
                videoId: 'M7lc1UVf-VE',
                events: {
                    'onReady': onPlayerReady,
                    'onStateChange': onPlayerStateChange
                }
            });
        }

        function onPlayerReady( event ) {
            console.log('PlayerReady');

            player.playVideo();
            setTimeout( function(){ player.pauseVideo(); pauseCounter++; }, 3000 );
        }

        function onPlayerStateChange( event ) {
            console.log( 'StateChange ' + event.data );

            if ( +event.data == 2 && pauseCounter == 1 ) {
                document.getElementsByTagName('body')[0].appendChild(document.getElementById('player'));
            }
        }
    </script>
</body>

如何在更新iframe后再次跟踪onstateChange事件。感谢。

添加了游乐场：https://jsbin.com/xuhuyugemi/edit?js,console,output

事件侦听器停止执行

0 个答案: