且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

使用HTML5设置视频播放的持续时间

更新时间:2023-01-06 08:09:47

我从未使用过TimeJump.js,但你可以听一下 timeupdate 媒体元素事件(音频和视频)。

I never used TimeJump.js but you can listen to the timeupdate event of the media element (audio and video).

var video = document.querySelector('video');

video.addEventListener('timeupdate', function() {
  // don't have set the startTime yet? set it to our currentTime
  if (!this._startTime) this._startTime = this.currentTime;

  var playedTime = this.currentTime - this._startTime;

  if (playedTime >= 10) this.pause();
});

video.addEventListener('seeking', function() {
  // reset the timeStart
  this._startTime = undefined;
});

<video controls="true" height="200" width="300">
  <source type="video/ogg" src="http://media.w3.org/2010/05/bunny/movie.ogv">
  <source type="video/mp4" src="http://media.w3.org/2010/05/bunny/movie.mp4">
</video>