我有一个在我的网站上播放的 HTML5 视频,我想跟踪这个视频的时间并让它在视频持续时间持续 10 秒、20 秒、30 秒等时执行功能或提醒。我我对如何做到这一点感到有点难过?我可以使用 jQuerys setInterval 让它每 10 秒提醒一次,但这是基于 jquerys 时间参数而不是电影本身......这就是我所拥有的
window.setInterval(function(){
var video = $('video#full-vid').get(0); //get the native browser source
alert('video time:' + video.currentTime);
}, 10000);
有什么想法吗?
基本上是这样的逻辑:
- 获取视频时间
- 如果 10 秒的视频通过警报“10 秒已通过”
- 如果 20 秒的视频通过警报“20 秒已经过去” 等等……
谢谢
最佳答案
你应该可以像那样做
// set event listener to execute on timeupdate. This gets invoked every ~250ms or so
$('video#full-vid').on('timeupdate',function() {
// use parseInt to round to whole seconds
var ct = parseInt(this.currentTime);
// only eval once per second inc, since timeupdate pops ~4 times per second
if (this.lastTime!=ct) {
// if current time is divisible by 10 then an inc of 10s has passed
if (ct%10===0) {
console.log(ct,'seconds have passed');
}
}
this.lastTime=ct;
});
编辑: 如果您希望在特定时间间隔执行此操作,您可以这样做:
// set event listener to execute on timeupdate. This gets invoked every ~250ms or so
$('video#full-vid').on('timeupdate',function() {
// use parseInt to round to whole seconds
var ct = parseInt(this.currentTime);
// only eval once per second inc, since timeupdate pops ~4 times per second
if (this.lastTime!=ct) {
// do something at specified time elapsed markers
switch (ct) {
case 10 :
// do something
break;
case 20 :
// do something
break;
}
}
this.lastTime=ct;
});
关于jquery - HTML5 视频时间跟踪,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20201693/