使用搜索链接加载多个视频播放器

时间:2014-10-11 16:02:11

标签: video youtube-api

我需要为这两个视频加载2个带有搜索链接的视频。

我可以使用以下代码为一个视频执行此操作:

     <div id="player"></div>
<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 onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
            height: '321',
            width: '530',
            videoId: 'IZ4uxjWUmtY',
            playerVars: {
                autoplay: 0,
                rel: 0,                 
            },
            events: {
                //'onReady': onPlayerReady
                //'onStateChange': onPlayerStateChange
            }
        });
    }    
    function onPlayerReady(event) {
        event.target.playVideo();
    }    
    var done = false;    
    function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.PLAYING && !done) {
            setTimeout(stopVideo, 6000);
            done = true;
        }
    }    
    function seekTo(secondes) {
        player.seekTo(secondes);
    }
</script>
<a class="conseil" href="javascript:void(0);" onClick="seekTo('0');">Link1</a>
<a class="conseil" href="javascript:void(0);" onClick="seekTo('605');">Link2</a>

我不知道如何使用搜索链接加载2个视频。有没有人知道怎么做?

1 个答案:

答案 0 :(得分:0)

为每个视频创建不同的player

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);    
var player;    
function onYouTubeIframeAPIReady() {
    player1 = new YT.Player('player', {
        height: '321',
        width: '530',
        videoId: 'IZ4uxjWUmtY',
        playerVars: {
            autoplay: 0,
            rel: 0,                 
        },
        events: {
            //'onReady': onPlayerReady
            //'onStateChange': onPlayerStateChange
        }
    });
    player2 = new YT.Player('player', {
        height: '321',
        width: '530',
        videoId: 'IZ4uxjWUmtY',
        playerVars: {
            autoplay: 0,
            rel: 0,                 
        },
        events: {
            //'onReady': onPlayerReady
            //'onStateChange': onPlayerStateChange
        }
    });

}    
function onPlayerReady(event) {
    event.target.playVideo();
}    
var done = false;    
function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING && !done) {
        setTimeout(stopVideo, 6000);
        done = true;
    }
}    
function seekToPlayer1(secondes) {
    player.seekTo(secondes);
}
function seekToPlayer2(secondes) {
    player.seekTo(secondes);
}

链接1 LINK2