js调用video的播放时长
<video id=“vid”> <source src="./video.mp4"></video> //尽量这样写 别直接再video中写src 那样会出现啊兼容性问题 <div class="time1">00:00:00</div> //视频播放时间 <div class="time1">88:88:88</div>// 视频总时长
var video=document.getElementById('vid'); var time1=document.querySelector('.time1'); var time2=document.querySelector('.time2'); //视频结束触发得事件 video.addEventListener("ended",function(){ video_Status.src="img/play.png"; }) // 视频可以播放触发得事件 一般是视频准备就绪触发得事件 video.addEventListener("canplay",function(){ var timers=Math.ceil(this.duration); //视频总时长 time2.innerHTML=timeToMinute(timers); }) // 视频当前播放事件发生变化 触发事件 video.addEventListener("timeupdate",function(){ var timers=Math.ceil(this.currentTime);//视频当前播放时长 time1.innerHTML=timeToMinute(timers); }) // 秒转换分钟00:00:00格式 function timeToMinute(times){ var t; if(times > -1){ var hour = Math.floor(times/3600); var min = Math.floor(times/60) % 60; var sec = times % 60; if(hour < 10) { t = '0'+ hour + ":"; } else { t = hour + ":"; } if(min < 10){t += "0";} t += min + ":"; if(sec < 10){t += "0";} t += sec.toFixed(2); } t=t.substring(0,t.length-3); return t; }
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战