html 获取视频时长_获取HTML5视频时长

html 获取视频时长

HTML5 video is exciting, if only for the reason that we no longer need Flash or other third party plugins to render media.  We can also create custom controls and displays around the video, and one of those displays should be the duration of the video.  Let me show you how to get and display the video duration!

HTML5视频令人兴奋,即使仅仅是因为我们不再需要Flash或其他第三方插件来呈现媒体。 我们还可以在视频周围创建自定义控件和显示,这些显示之一应该是视频的持续时间。 让我告诉您如何获取和显示视频时长!

JavaScript (The JavaScript)

video elements have a duration property which represents the number of seconds in the video.  To display the duration in a pretty fashion, you'll need to use parseInt and modulus (%):

video元素具有duration属性,该属性表示视频中的秒数。 要以一种漂亮的方式显示持续时间,您需要使用parseInt和模数( % ):


// Assume "video" is the video node
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);


It's important to use setInterval and check the video's readyState in case the video hasn't loaded by the time you attempt to pull the duration.  parseInt is used to get the minute number and modulus is used to get the second count.

重要的是使用setInterval并检查视频的readyState ,以防在您尝试拉长持续时间之前尚未加载视频。 parseInt用于获取分钟数,而模数用于获取第二个计数。

翻译自: https://davidwalsh.name/html5-video-duration

html 获取视频时长

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值