在视频标签html5中获取加载时间 - Get loading time in video tag html5

Get loading time in video tag html5

我想获得html5视频标签的加载时间。如果前5秒视频没有播放，那么页面将被重定向到另一个链接

这里是我的代码:

<body  onLoad="document.getElementById('myVideo').play();document.getElementById('myVideo').width=swidth;document.getElementById('myVideo').height=sheight;" style="background-color:#000;text-align:center;">
<video    id="myVideo">
<source src="<?php echo $this->baseUrl ?>/xsn/XSun.webm" type="audio/webm" />
<source src="<?php echo $this->baseUrl ?>/xsn/XSun.mp4" codecs="avc1.42E01E, mp4a.40.2" type="audio/mpeg">
<source src="<?php echo $this->baseUrl ?>/xsn/XSun.ogv" type="audio/ogg">
</video>
<script type="text/javascript">
  $(document).ready(function(){   
   $("#myVideo").bind('ended', function(){
      location.href="<?php echo $this->baseUrl ?>";   
   }); 
  });
</script>

请帮

谢谢Amit Anand

应该可以了。创建一个Javascript超时，以便在5秒后重定向，并将事件处理程序附加到playing媒体事件以清除超时。这样，如果视频在5秒超时内开始播放，则重定向将不会发生。

$(document).ready(function() {
    var video = $('#myVideo');
    var timeout = setTimeout(function() {
        location.href = "http:// whatever";
    }, 5000);
    video.bind('playing', function() {
        clearTimeout(timeout);
    });
    video.get(0).play();
});

//注释太短

根据jQuery文档，你的代码应该至少是:

<body style="background-color:#000;text-align:center;">
<video id="myVideo">
<source src="<?php echo $this->baseUrl ?>/xsn/XSun.webm" type="audio/webm" />
<source src="<?php echo $this->baseUrl ?>/xsn/XSun.mp4" codecs="avc1.42E01E, mp4a.40.2" type="audio/mpeg">
<source src="<?php echo $this->baseUrl ?>/xsn/XSun.ogv" type="audio/ogg">
</video>
<script type="text/javascript">
  $(function(){
    // swidth and sheight are global variables ?
    document.getElementById('myVideo').width=swidth;
    document.getElementById('myVideo').height=sheight;
    document.getElementById('myVideo').play();
   $("#myVideo").bind('ended', function(){
      location.href="<?php echo $this->baseUrl ?>";   
   }); 
  });
</script>