javascript - 如何停止同时播放嵌入的 Youtube 视频

Question

SoundCloud 播放器有一个默认功能，当用户启动一个播放器时，它会自动暂停当前正在播放的所有其他播放器。 (例如:http://jsfiddle.net/Vx6hM/)。

我正在尝试使用通过普通嵌入代码动态添加的嵌入式 YouTube 视频来重新创建它。

使用这个:https://stackoverflow.com/a/7513356/938089 还有这个:https://stackoverflow.com/a/7988536/1470827

我能做到这一点:

function chain(){

$('.post').each(function(){
    var player_id = $(this).children('iframe').attr("id");
    var other_player_id = $(this).siblings().children('iframe').attr("id");

    player = new YT.Player( player_id, { 

        events:
            {      
            'onStateChange': function (event) 
                {

                if (event.data == YT.PlayerState.PLAYING) 
                    { callPlayer( other_player_id , 'pauseVideo' );
                     alert('Trying to pause: ' + other_player_id);
                    }            

                }
            }        
    });

});

}

这是一个 JS Bin，它只工作了一半:http://jsbin.com/oxoyes/2/edit

目前，它只调用其中一名玩家。我需要它来暂停除正在玩游戏的玩家之外的所有其他玩家。

此外，欢迎提供任何有关如何清理和/或以不同方式/更好方式进行清理的提示。我对 javascript 还是很陌生，所以我什至不确定我是否以正确的方式处理它。

谢谢!

Answer 1

您最多只能让一名玩家在给定时间玩游戏。与其尝试暂停所有正在播放的内容，不如将其视为尝试暂停正在播放的内容。当然，没有人可以玩。鉴于此，请查看以下代码。您维护一个外部范围变量并在必要时暂停它，同时将其设置为您之后刚开始玩的玩家。

var playerCurrentlyPlaying = null;
function chain(){       
    $('.post').each(function(){
        var player_id = $(this).children('iframe').attr("id");
        player = new YT.Player( player_id, { 
            events:
                {      
                'onStateChange': function (event) 
                    {

                    if (event.data == YT.PlayerState.PLAYING) 
                        { 
                          if(playerCurrentlyPlaying != null && 
                          playerCurrentlyPlaying != player_id)
                          callPlayer( playerCurrentlyPlaying , 'pauseVideo' );
                          playerCurrentlyPlaying = player_id;

                        }            

                    }
                }        
        });
    });
}