如何在HTML5视频中获得寻找事件的起点

How to get the starting point of a seeking event in HTML5 Video?

本文关键字：寻找 事件 起点 HTML5 视频      更新时间：2023-09-26

我发现在HTML5视频中，当用户通过单击控件执行查找操作时，无法获得查找前的时间。

我想做的是，每当用户在某个点上搜索视频时，系统都会在用户搜索之前准确地知道在什么点上。例如，如果用户一直在看视频到2:00，然后在4:00单击控件，我们需要跟踪时间2:00。我试着寻找事件，但找不到时间2:00。它总是把4点的时间还给我。有什么解决办法吗？

使用单击事件来跟踪导致查找事件的单击。使用video.js 的示例

var clickTime = 0;
this.controlBar.on('click', function(){
    clickTime = player.currentTime();
});
this.on('seeking', function(){
    seekTime = clickTime;
    //do stuff
});

由于timeupdate事件，您应该能够在短延迟内跟踪此事件：

var video = document.querySelector('video');
video.BP = 0;
video.addEventListener('timeupdate', function(e){
var that = this;
(function(){
	setTimeout(function(){
	  that.BP=that.currentTime;
  	}, 500);
  }).call(that);}
  );
video.addEventListener('seeking', function(e){
  log('boringPart = '+this.BP+
        " gone to "+this.currentTime)
  })
function log(txt){document.querySelector('p').innerHTML = txt;}
<video controls="true" autoplay="true" height="200" width="600"><source type="video/ogg" src="http://media.w3.org/2010/05/sintel/trailer.ogv"><source type="video/mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4"></video>
<p style="position:absolute; top: 0.5em;left: 3em; color: #FFF;background:#000"></p>

相关文章：