我想知道为什么YouTube onPlayerStateChange无法正常工作。
在那种情况下,当YouTube视频结束时,我不会收到任何警报消息(或任何其他事件)。
任何的想法 ?
<!doctype html>
<html lang="en">
<body>
<iframe src=""></iframe>
<script src="js/jquery.js"></script>
<script src="http://www.youtube.com/iframe_api"></script>
<script>
function onPlayerStateChange(event) {
switch(event.data) {
case YT.PlayerState.ENDED:
alert('VIDEO IS ENDED'); // <<<--- THIS IS NOT WORKING
break;
}
}
jQuery(document).ready(function($) {
var vidId = 'uIv6u7pdR5I';
$('iframe').attr('src', "https://youtube.googleapis.com/v/" + vidId);
new YT.Player('player_'+vidId, {
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
},
playerVars: { autohide: 1, showinfo: 0 }
});
});
</script>
</body>
</html>
最佳答案
如果按照https://developers.google.com/youtube/iframe_api_reference中的说明使用Youtube API,它似乎可以正常工作
即,像这样的东西:
<!doctype html>
<html lang="en">
<body>
<div id="player"></div>
<script src="http://www.youtube.com/iframe_api"></script>
<script>
function onPlayerStateChange(event) {
switch(event.data) {
case YT.PlayerState.ENDED:
alert('VIDEO IS ENDED'); // <<<--- THIS IS WORKING
break;
}
}
var player;
function onYouTubeIframeAPIReady() {
var vidId = 'uIv6u7pdR5I';
player= new YT.Player('player', {
videoId: vidId,
events: {
// 'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
},
playerVars: { autohide: 1, showinfo: 0 }
});
}
</script>
</body>
</html>
使用您的代码时出现错误,因为您没有等待onYouTubeIframeAPIReady回调并且onReady引用了一个不存在的函数。
另外,将iframe src设置为youtube视频url当然会导致视频显示在页面上,但与Youtube api没有关系,因此没有理由为什么该播放器会触发onPlayerStateChange。
关于javascript - YouTube onStateChange事件无法正常运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22583270/