如何禁用HTML5视频标签？ [英] How to disable seeking with HTML5 video tag ?

问题描述

我知道这不可取。但仍需要实现此功能。从寻求，探索到媒体控制器尝试了一切。没有工作。是否有任何外部库禁用搜索。如果有关如何使用自定义控件的一些指示会有所帮助。

I know this is not advisable. But still need this feature to be implemented. Tried everything from onseeking,onseeked to media controller. Nothing worked. Are there any external libraries to disable seeking. would be helpful if some pointers on how to go about using custom controls.

推荐答案

这个问题很老但是仍然相关所以这里是我的解决方案：

The question is quite old but still relevant so here is my solution:

var video = document.getElementById('video');
var supposedCurrentTime = 0;
video.addEventListener('timeupdate', function() {
  if (!video.seeking) {
        supposedCurrentTime = video.currentTime;
  }
});
// prevent user from seeking
video.addEventListener('seeking', function() {
  // guard agains infinite recursion:
  // user seeks, seeking is fired, currentTime is modified, seeking is fired, current time is modified, ....
  var delta = video.currentTime - supposedCurrentTime;
  if (Math.abs(delta) > 0.01) {
    console.log("Seeking is disabled");
    video.currentTime = supposedCurrentTime;
  }
});
// delete the following event handler if rewind is not required
video.addEventListener('ended', function() {
  // reset state in order to allow for rewind
    supposedCurrentTime = 0;
});

JsFiddle

它与玩家无关，即使显示默认控件也能正常工作，即使在控制台中键入代码也无法规避。

It is player agnostic, works even when the default controls are shown and cannot be circumvented even by typing code in the console.

这篇关于如何禁用HTML5视频标签？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！