我在网页上嵌入了多个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′.
任何帮助将非常感激.@H_301_11@先感谢您.
解决方法
您实际上想要使用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(); } }