在播放另一个时暂停YouTube iframe嵌入

我在网页上嵌入了多个YouTube iFrame.如果其中一部电影已经播放,然后用户决定开始播放另一部电影,是否可以停止播放第一部电影,这样一次只播放一部电影？

我查看过’iframe嵌入的YouTube播放器API参考’https://developers.google.com/youtube/iframe_api_reference,但如果我说实话,我就是不明白.我的开发人员技能非常有限……很明显.

可怜的我知道,但这就是我现在所拥有的(只是iFrames)…… http://jsfiddle.net/YGMUJ/

<iframe width="520" height="293" src="http://www.youtube.com/v/zXV8GMSc5Vg?version=3&enablejsapi=1" frameborder="0" allowfullscreen></iframe>
<iframe width="520" height="293" src="http://www.youtube.com/v/LTy0TzA_4DQ?version=3&enablejsapi=1" frameborder="0" allowfullscreen></iframe>

我认为我需要做的就是在视频网址的末尾添加’& enablejsapi = 1′.

任何帮助将非常感激.
先感谢您.

解决方法

您实际上想要使用iFrame Player API,而不是使用iframe.根据您实际想要嵌入的视频数量,您可能希望使这个javascript更具动态性,但是这个工作示例应该足以让您开始使用.

基本上我在这里做的是初始化两个玩家,并在玩家状态改变播放时暂停相反的视频.

您可以在http://jsfiddle.net/mattkoskela/Whxjx/播放以下代码

<script>
var tag = document.createElement('script');
tag.src = "//www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag,firstScriptTag);

var player;
function onYouTubeIframeAPIReady() {
    player1 = new YT.Player('player1',{
        height: '293',width: '520',videoId: 'zXV8GMSc5Vg',events: {
            'onStateChange': onPlayerStateChange
        }
    });
    player2 = new YT.Player('player2',videoId: 'LTy0TzA_4DQ',events: {
            'onStateChange': onPlayerStateChange
        }
    });
}

function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING) {
        stopVideo(event.target.a.id);
    }
}

function stopVideo(player_id) {
    if (player_id == "player1") {
        player2.stopVideo();
    } else if (player_id == "player2") {
        player1.stopVideo();
    }
}