刚发现一个新问题,客户端说播放按钮在youtube嵌入式视频上不起作用。它似乎仅在手机上不起作用,我已经在iphone和sony手机上对其进行了测试,并且在这两者上均不起作用,但是在计算机上查看网站时可以起作用。
代码在下面
<div class="item active" style="">
<!--<iframe width="100%" src="//www.youtube.com/embed/3a3kT55-fF0?enablejsapi=1&rel=0" frameborder="0" id="video" allowfullscreen></iframe>-->
<iframe width="100%" src="//www.youtube.com/embed/3a3kT55-fF0?enablejsapi=1&rel=0&ps=docs&controls=1" frameborder="0" id="video" allowfullscreen></iframe>
<div class="carousel-caption">
<h4 class=""></h4>
<p class="">
</p>
</div>
</div>
<script>
// Inject YouTube API script
var tag = document.createElement('script');
tag.src = "//www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubePlayerAPIReady() {
// create the global player from the specific iframe (#video)
player = new YT.Player('video', {
events: {
// call this function when player is ready to use
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING) {
$("#myCarousel").carousel('pause');
}
else if(event.data == YT.PlayerState.PAUSED){
$("#myCarousel").carousel('cycle');
}
}
function onPlayerReady(event) {
// bind events
$("#myCarousel").on('slide.bs.carousel', function (e){
//alert($(e.relatedTarget).index();
if($(e.relatedTarget).index()!=0 && YT.PlayerState.PLAYING){
//alert('A new slide is about to be shown!');
player.pauseVideo();
}
});
}
</script>