HTML5视频播放器 - video.js - Chromium和Mozilla Firefox视频播放结束时的不同行为

Question

我正在使用video.js，

我正在两个不同的浏览器中呈现视频。

Chromium：版本31.0.1650.63 Ubuntu 13.04和

Mozilla Firefox：26.0

我已选择自动播放视频

HTML标记和Jq代码如下。

<script type="text/javascript">
  $("video").on("ended", function(){ 
      var vid = videojs($(this).attr("name"));
      vid.controlBar.hide();
      vid.bigPlayButton.show();
    });     
  $("video").on("pause", function()
    { 
       var vid = videojs($(this).attr("name"));
       vid.bigPlayButton.show(); 
    });  
  $("video").on("play", function(){  
       var vid = videojs($(this).attr("name"));
       vid.controlBar.show();
       vid.bigPlayButton.hide();
    });
 </script>

视频播放结束时 - firefox浏览器显示一些微调器，而chrome显示矩形框以点击重新播放视频。

请告诉我们为什么行为有区别？ 我们如何克服这个问题？

Answer 1

您可以通过执行以下操作来尝试使用videojs事件：

var activePlayers = videojs.players;
$.each( activePlayers, function(key,value) { 
    value.on('ended', function() {
        this.controlBar.hide();
        this.bigPlayButton.show();
        this.loadingSpinner.hide();
    });
});

这是相当快的，可能会稍微调整一下，主要是使用$.each vs for( x in obj)，如果jquery在jquery对象中包装value。

除此之外：我知道在循环中使用匿名函数是不受欢迎的，但这是为了给你一个想法。