h5教程html5 video如何实现实时监测当前播放时间(代码)

 所属分类:web前端开发

 浏览:122次-  评论: 0次-  更新时间:2022-10-24
描述:更多教程资料进入php教程获得。 这篇文章给大家介绍的内容是关于html5 video如何实现实时监测当前播放时间(代码),有一定的参考价值,有...
更多教程资料进入php教程获得。 这篇文章给大家介绍的内容是关于html5 video如何实现实时监测当前播放时间(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

html:

<video id="video" controls autoplay="autoplay" muted>
	<source src="" type="video/mp4" />
	Your browser does not support the video tag.
</video>
登录后复制

js:

//监听播放时间
var video = document.getElementById('video');
//使用事件监听方式捕捉事件
video.addEventListener("timeupdate",function(){
    var timeDisplay;
	//用秒数来显示当前播放进度
	timeDisplay = Math.floor(video.currentTime);
	console.log(Math.floor(video.currentTime))
    //当视频播放到 4s的时候做处理
	if(timeDisplay == 4){
	        //处理代码
	}
},false);
登录后复制

相关文章推荐:

html5中audio(音频)的分析

html5中video(视频)元素的分析

以上就是html5 video如何实现实时监测当前播放时间(代码)的详细内容,更多请关注zzsucai.com其它相关文章!

 标签: html5video,
积分说明:注册即送10金币,每日签到可获得更多金币,成为VIP会员可免金币下载! 充值积分充值会员更多说明»

讨论这个素材(0)回答他人问题或分享使用心得奖励金币

〒_〒 居然一个评论都没有……

表情  文明上网,理性发言!