我正在播放基于youtube播放器api的倍数,当我点击单人播放器播放时,当点击第二个播放器时,第一个播放器正在显示并与第二个播放器同时播放,
任何人都可以告诉我如何在播放单个视频时阻止播放多个视频
这是我的代码:
<!DOCTYPE html>
<html>
<body>
<?php
for($i=1;$i<10;$i++)
{
?>
<div class="youtubeplayer" playerid='player<?=$i?>' style="cursor:pointer">
<div id="player<?=$i?>">player<?=$i?></div>
</div>
<?php
}
?>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
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;
$(function()
{
$('.youtubeplayer').click(function()
{
var playerid=$(this).attr('playerid');
player = new YT.Player(playerid ,
{
height: '390',
width: '640',
videoId: 'kK42LZqO0wA',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
});
});
function onPlayerReady(event) {
event.target.playVideo();
}
function onPlayerStateChange(event)
{
if(event.data == YT.PlayerState.PLAYING)
{
alert('playing');
}
else
{
alert('paused');
}
}
function stopVideo() {
player.stopVideo();
}
</script>
</body>
</html>
答案 0 :(得分:0)
这个 DEMO 适用于我而不使用三个静态html div同时播放
<div class="youtubeplayer" playerid='player1' style="cursor:pointer">
<div id="player1">player</div>
</div>