Question

我在后台有一个带有YouTube播放列表的滑块。我想知道视频何时发生变化，因此我可以将滑块文本更改为右侧文本。

我搜索了API页面（https://developers.google.com/youtube/iframe_api_reference#Events），似乎无法找到视频发生变化时触发的事件。有吗？

这是我的代码，直到现在。

var tag = document.createElement('script');

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

window.player;
var player;

var playlistVideos = new Array();
jQuery('#playlistSlider span').each(function(){
    playlistVideos.push(jQuery(this).html());
})

//console.log(playlistVideos)

function onYouTubePlayerAPIReady() {
    player = new YT.Player('playlistSlider', {
        height: '390',
        width: '640',
        loadPlaylist:{
            listType:'playlist',
            list:playlistVideos,
            index:parseInt(0),
            //suggestedQuality:'small'
        },
        events: {
            'onReady': onPlayerReady,
            //'onStateChange': onPlayerStateChange
        },
    });
}
function onPlayerReady(event) {
    event.target.loadPlaylist(playlistVideos);
    event.target.mute();
    event.target.setLoop(true);
}

奖金也可以是知道当前播放的视频（索引）。

Answer 1

听取播放器的onStateChange回调。

events: {
    onReady': onPlayerReady,
    'onStateChange': onPlayerStateChange
}

如果事件值为0，则视频已结束

function onPlayerStateChange(event) {
    if (event.data == 0) {
        // video ended
    }
}

要了解当前播放视频的索引，请保留最初设置为0的变量index。当前视频结束并加载下一个视频时，将index递增1。 index值将指向playlistVideos中的当前视频。

检测视频何时发生变化 - YouTube iFrame API

1 个答案: