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


本文摘自PHP中文网,作者不言,侵删。

这篇文章给大家介绍的内容是关于html5 video如何实现实时监测当前播放时间(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

html:

1

2

3

4

<video id="video" controls autoplay="autoplay" muted>

    <source src="" type="video/mp4" />

    Your browser does not support the video tag.

</video>

js:

1

2

3

4

5

6

7

8

9

10

11

12

13

//监听播放时间

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);

相关文章推荐:

阅读剩余部分

相关阅读 >>

h5文件异步上传

HTML5绘制折线图的实例代码

HTML5上传视频无法播放以及兼容的解决方法(图)

HTML5 figure标签是什么意思?HTML5 figure标签的使用方法详解

HTML5和css3扁平化风格博客教程的资源分享

利用HTML5以及canvas实现支持签名插件的方法

HTML5离线应用application cache的代码详解

详解websocket跨域问题解决

使用HTML5里的classlist操作css类的详细介绍

一定要注意常见的3种HTML5错误用法

更多相关阅读请进入《HTML5》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...