video视频实时获取暂停和结束时间,且仅获取一次,不多次触发监听事件,仅获取一次值
时间: 2024-11-30 09:20:04 浏览: 5
如果你希望在视频加载完成后一次性获取到视频的暂停和结束时间,并避免多次触发监听事件,你可以通过监听视频的特定事件并在这些事件发生时记录时间。但需要注意的是,大部分视频库不会直接提供停止时间(通常只有播放结束),所以我们只能获取到播放开始时间和暂停时间。
以下是使用HTML5 Video API的一个简单示例:
```javascript
function getVideoInfo(videoElement) {
let startTime = null;
let endTime = null;
// 当视频加载完成并且准备好播放时获取开始时间
videoElement.addEventListener('canplaythrough', function() {
startTime = Date.now(); // 获取当前时间点
});
// 当视频暂停时获取暂停时间
videoElement.addEventListener('pause', function() {
const pausedTime = Date.now();
endTime = pausedTime; // 如果尚未设置结束时间,就赋值为暂停时间
});
// 视频结束时,结束时间会自动更新为总时长减去开始时间
videoElement.addEventListener('ended', function() {
endTime = videoElement.duration - startTime;
});
// 清除监听,防止过多事件触发
videoElement.removeEventListener('canplaythrough', arguments.callee);
videoElement.removeEventListener('pause', arguments.callee);
videoElement.removeEventListener('ended', arguments.callee);
return { startTime, endTime };
}
const video = document.getElementById('myVideo');
const videoInfo = getVideoInfo(video);
console.log('视频开始时间:', videoInfo.startTime);
console.log('视频结束时间 (如果视频未暂停):', videoInfo.endTime);
```
这段代码会在视频加载完成后和暂停时保存对应的时间,当视频结束后,计算并返回总的播放时间(如果不曾暂停)。注意,在实际应用中,由于浏览器的行为可能略有差异,某些情况下,视频可能无法准确地获取到确切的结束时间,特别是在用户手动操作的情况下。
阅读全文