Question

我正在使用modal box of bootstrap来使用videojs加载视频。我需要从数据库中获取视频文件名。

当有人点击链接时，会调用playVideo()函数。我做的是我用id videoPlayer填充div并用视频代码填充它。这是我的playVideo功能：

 function playVideo(id)
  {
   $('video').attr('id','CurrentVideo'+id);
    var videoData=new Array();
   $.getJSON('<?PHP echo base_url();?>admin/content/getVideoDetail/'+id,function(data){
       $.each(data,function(k,v){
           videoData.push(v);
           });
       }).done(function(){

     $("#videoPlayer").html('<video id="CurrentVideo'+id+'" class="video-js vjs-default-skin" controls width="530" height="264" preload="none"> <source type="video/mp4" src="<?PHP echo base_url()?>content/videos/'+videoData[3]+'"></video>');

    myPlayer=_V_('CurrentVideo'+id);

    $("#videoBox").modal();

    $("#videoBox").on('hide',function(){
     $("#videoPlayer").html('');
    });
       });
   }

这有时会起作用，但在所有浏览器中都不能保持一致。我采取了错误的做法吗？此外，videojs有任何缺陷吗？我应该使用像flowplayer这样的其他替代方案吗？

Answer 1

显然你只指定了mp4。因此它将在Chrome上播放（也可能在iDevices上播放），但不会在Firefox等播放。

您能否提供有关哪个浏览器正在运行哪个浏览器以及哪个浏览器不在哪个浏览器的更多信息？

Answer 2

使用VideoJS时遇到的一些事情：

自动播放是一个坏主意。如果您希望模式出现并且视频立即开始播放，它将仅在某些浏览器中正常工作。大多数其他浏览器都有问题（即音频流的两个实例将开始播放）
$（“＃videoPlayer”）。html（''）你实际上是在吹走HTML。如果您担心性能，请避免这种情况。尝试重新使用现有的代码/标签。大多数开发人员都认为通过吹掉HTML来节省内存 - 不一定是真的。

这不是VideoJS的问题。我见过很多不同的视频JS库，但他们并没有很好地处理HTML5视频。

在bootstrap模式中动态加载视频

2 个答案: