当前位置 : 主页 > 网页制作 > html5 >

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

来源:互联网 收集:自由互联 发布时间:2021-08-18
这篇文章给大家介绍的内容是关于html5 video如何实现实时监测当前播放时间(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 html: video id=video controls auto
这篇文章给大家介绍的内容是关于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如何实现实时监测当前播放时间(代码)的详细内容,更多请关注自由互联其它相关文章!

网友评论