javascript 如何从我的 video.js 播放器监听“timeupdate”事件?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/29618851/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I listen for the "timeupdate" event from my video.js player?
提问by coyote
While I have been able to listen for the "timeupdate" event with a vanilla HTML5 player, I can't seem to get it to work with video.js.
虽然我已经能够使用普通 HTML5 播放器收听“timeupdate”事件,但我似乎无法让它与 video.js 一起使用。
Here's my code:
这是我的代码:
<!DOCTYPE html>
<html>
<head>
<link href="video-js.css" rel="stylesheet">
<script src="video.js"></script>
<script src="jquery.min.js"></script>
</head>
<body>
<video id="testvid" class="video-js vjs-default-skin" controls width="640" height="480" data-setup='{}'>
<source src="testvideo.mp4" type="video/mp4">
</video>
</body>
</html>
<script>
videojs('testvid').ready(function(){
var myPlayer = this;
$(myPlayer).bind('timeupdate', function(){
console.log('the time was updated to: ' + this.currentTime);
});
});
</script>
Am I misunderstanding a basic way that video.js operates?
我是否误解了 video.js 的基本操作方式?
回答by Grigory
You actually CAN register events in callback of ready(), and it is better solution because in previous one registration of event still could be finished after ready(). Use following snippet:
实际上你可以在ready()的回调中注册事件,这是更好的解决方案,因为在前一个事件注册在ready()之后仍然可以完成。使用以下代码段:
videojs('example_video_1').ready(function () {
this.on('timeupdate', function () {
console.log(this.currentTime());
})
});
回答by coyote
I have to add the event listener before the video loads. I solved the problem by changing the script to:
我必须在视频加载之前添加事件侦听器。我通过将脚本更改为:
<script>
$('#testvid').on('timeupdate', function(){
console.log('the time was updated to: ' + this.currentTime);
});
videojs('testvid').ready(function(){
var myPlayer = this;
});
</script>