Question

我正在使用jQuery开发HTML5视频播放器。目前我的视频播放器工作得非常好，但我想获取视频持续时间的变量并在纯HTML页面中显示/显示它。

所以从这里您可以获取有关此Jquery视频播放器的更多信息： http://www.videojs.com/docs/api/

我认为视频时长的变量是：myPlayer.duration();

如何在HTML中显示此值？

以下是我显示播放器的HTML代码：

  <video id="vemvo-player" class="video-js vjs-default-skin" controls autoplay="true" width="950" height="534"
      data-setup="{}">
    <source src="[var.base_url]/uploads/[var.video_play]" type='video/flv' />
  </video>

这是我试图显示的这个变量，但它说在视频播放器上它是=“0”它说它是4分钟：

  <video id="vemvo-player" class="video-js vjs-default-skin" controls autoplay="true" width="950" height="534"
      data-setup="{}">
    <source src="[var.base_url]/uploads/[var.video_play]" type='video/flv' />
  </video>
<div id="duration"></div>
<script type="text/javascript">
    _V_("vemvo-player").ready(function(){
        var myPlayer = this;
        var howLongIsThis = myPlayer.duration();
        $('#duration').html('Duration: ' + howLongIsThis);
    });
</script>

我的错误在哪里？

Answer 1

当你使用jQuery时，可以更轻松地完成:)你可以使用$.html来编辑dom元素的html内容。您的代码将如下所示：

<div id="duration"></div>

<script type="text/javascript">
    _V_("vemvo-player").ready(function(){
        var myPlayer = this;
        var howLongIsThis = myPlayer.duration();
        $('#duration').html('Duration: ' + howLongIsThis);
    });
</script>

Answer 2

您可以尝试一下。它对我有用。

var myPlayer = videojs('vemvo-player');

    if (myPlayer.readyState() < 1) {
        // wait for loadedmetdata event
        myPlayer.one("loadedmetadata", onLoadedMetadata);
    }
    else {
        // metadata already loaded
        onLoadedMetadata();
    }

    function onLoadedMetadata() {
        alert(myPlayer.duration());
        $('#duration').html("Duration: " + myPlayer.duration());
    }

Answer 3

var player = videojs('my-video', {
    fluid:false, // videojs settings
    controls:true,
    height: '300'          
  });
$(document).ready(function(){
  console.log(player.duration()); 
 // will return video duration. Can't be used while page is loading.

  console.log(player.currentTime()); 
 // will return current time if video paused at some time. Intially it would be 0.

});

显示videoJS的视频时长

3 个答案: