Question

考虑我在DOM的两个独立视图中有两个独立的玩家。每个播放器都通过unique从我的数据库获取异步视频文件 ID。所以对于第一个视频播放器它工作正常。但我不确定与第二个视图中的第二个玩家做同样的事情。

<div class="View_1">
<div data-swf="<?php echo base_url();?>scripts/flowplayer.swf"
      class="flowplayer no-toggle play-button"
       data-ratio="0.625" data-embed="false">
      <video id="myPlayer_1">
         <source type="video/webm" src="http://stream.flowplayer.org/bauhaus/624x260.webm"/>
      </video>
   </div>
</div>

<div class="View_2">
<div data-swf="<?php echo base_url();?>scripts/flowplayer.swf"
      class="flowplayer no-toggle play-button"
       data-ratio="0.625" data-embed="false">
      <video id="myPlayer_2">
         <source type="video/webm" src="http://stream.flowplayer.org/bauhaus/624x260.webm"/>
      </video>
   </div>
</div>

在Javascript部分我这样做：

$(".filmStackPlay").live("click",function(){
        VideoUrl="http://content.unibox.tj/movies/"+$(this).attr("file");
         var api = flowplayer(0);
       api.load([
        { mp4: VideoUrl}]);
        $(".videoPlayerContainer").show();
        $(".videoPlayerContainer").animate({top:"0px"},300);
        $(".videoOverlay").show();       
});

我通过这种方法在第一个视图中卸载播放器：

function UnloadVideo(){
        var api = flowplayer(0);
        api.unload();
        $(".videoPlayerContainer").hide();
        $(".videoPlayerContainer").css("top","-500px");
        $(".videoOverlay").hide();
}

问题是如何将视频加载到第二个视图。

Answer 1

要加载第一个播放器，请执行以下操作

var api = flowplayer(0);
api.load();

要加载第二个播放器，您只需将索引增加一个。

var api = flowplayer(1);
api.load();

使用Flowplayer在两个不同的视图中播放多个视频

1 个答案: