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

相关文章推荐:

阅读剩余部分

相关阅读 >>

HTML5跨域信息交互技术之postmessage代码实例详解

HTML5调用百度地图api获取当前位置并直接导航目的地的方法

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

如何让HTML5手机端弹出遮罩菜单特效

详细分析HTML5 formdata对象的使用

HTML5无插件多媒体media-音频audio与视频video的详细介绍

HTML5实战-canvas绘制钟表的示例代码分享

HTML5有哪些新特性?HTML5新特性详解

canvas与h5如何实现视频截图功能

HTML5 datalist标签的用法是什么?这里有datalist标签的用法实例

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




打赏

取消

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

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

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

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

评论

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