【发布时间】：2015-06-05 12:06:18
【问题描述】：
我正在加载 YouTube 播放器 API，如下所示 一旦我在我的幻想箱中播放的 youtube 视频结束，我会尝试触发一个事件。并显示一个弹出窗口。
这是我找到并尝试过但事件未触发的代码
<!doctype html>
<html lang="en">
<body>
<a class="fancybox fancybox.iframe" id="vdo" href="http://www.youtube.com/embed?listType=playlist&list=PL590L5WQmH8f_0qlZ-tKrtbfw4n0jyHQ">Video #1</a>
<script>
// Fires whenever a player has finished loading
function onPlayerReady(event) {
event.target.playVideo();
}
// Fires when the player's state changes.
count = 0;
function onPlayerStateChange(event) {
if(event.data == 0)
{
count++;
}
if(count == 6)
{
$("#popup-wrapper-center").show();
}
}
// The API will call this function when the page has finished downloading the JavaScript for the player API
function onYouTubePlayerAPIReady() {
// Initialise the fancyBox after the DOM is loaded
$(document).ready(function() {
$(".fancybox")
.attr('rel', 'gallery')
.fancybox({
openEffect : 'none',
closeEffect : 'none',
nextEffect : 'none',
prevEffect : 'none',
padding : 0,
margin : 50,
beforeShow : function() {
// Find the iframe ID
var id = $.fancybox.inner.find('iframe').attr('id');
// Create video player object and add event listeners
var player = new YT.Player(id, {
events: {
'onStateChange': onPlayerStateChange
}
});
}
});
});
}
</script>
</body>
</html>
【问题讨论】：
标签： jquery html youtube fancybox