分享好友 教程首页 教程搜索 频道列表

html5 video获取当前时间和视频总时间长度

2020-05-22 19:1729670
+关注2
核心提示:标签:videoid="video-active"class="video-active"width="640"height="390"contro...

标签:

<video
    id="video-active"
    class="video-active"
    width="640"
    height="390"
    controls="controls">
    <source src="myvideo.mp4" type="video/mp4">
</video>
<div id="current">0:00</div>
<div id="duration">0:00</div>

JS:

$(document).ready(function(){
  $("#video-active").on(
    "timeupdate", 
    function(event){
      onTrackedVideoframe(this.currentTime, this.duration);
    });
}

function onTrackedVideoframe(currentTime, duration){
    $("#current").text(currentTime);
    $("#duration").text(duration);
}


本文标签: #时间 #视频
整理员:网络
免责声明:凡注明来源本网的所有作品,均为本网合法拥有版权或有权使用的作品,欢迎转载,注明出处。非本网作品均来自互联网,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。
生成海报
您可能在找更多

DESTOON9.0网站管理系统更新升级时间表

    至DESTOON9.0发布以来,系统更新时间周期版本表2023-03-20• DESTOON网站管理系统V9.0正式版发布2023-03-23• DESTOON网站管理系统20230323更新2023-03-31• DESTOON网站管理系统20230331更新2023-04-06• DESTOON网

小黑 destoon程序2024-11-06

使用PHP怎么对指定的时间段进行判断

    本篇文章给大家分享的是有关使用PHP怎么对指定的时间段进行判断,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧

小黑 PHP2022-09-11

宝塔面板 如何修改服务器时间

    宝塔面板 如何修改服务器时间?我们有时候安装宝塔面板后,服务器的时间和实际时间有误差,那怎么调整为正常的时间呢,下面介绍几种设置方法。1、登陆宝塔面板控制后台– 面板设置– 服务器时间,点击同步2、或者安

小黑 宝塔面板2022-09-05

countDown倒计时

    需要用代码自行测试

网络转载 JavaScript教程2022-03-28

JS判断展会离展会的时间天数

    需要加在模板测试

小黑 JavaScript教程2022-03-24

下一篇
我来说两句
抢沙发