html5 是令人兴奋的, 单从我们再也不需要 Flash 和其它第三方浏览器插件播放视频这一点上说就已经足够了. 在 HTML5 视频上我们可以自定义播放控制和现实效果, 我们还可以在线获取视频的各种信息, 比如今天要说的如果获取视频时长信息.
JavaScript 代码
video 元素有一个 duration 属性, 它表示的是视频时长的秒数, 在页面上为了能更友好的显示时间, 我们还需要对这些秒数进行格式化, 需要使用到 parseInt 和余数操作 (%):
- // 假设 "video" 就是这个视频元素
- var i = setInterval(function() {
- if(video.readyState> 0) {
- var minutes = parseInt(video.duration / 60, 10);
- var seconds = video.duration % 60;
- // (Put the minutes and seconds in the display)
- clearInterval(i);
- }
- }, 200);
需要说明的一点是, 我们需要使用 setInterval 来检查视频的 readyState 是否有效, 如果视频还没有加载成功, 我们就去获取这个值, 得到的数值就会有问题. parseInt 是用来获取分钟数, 余数操作时用来获取秒数.
来源: http://www.webhek.com/post/html5-video-duration.html