10

HTML5 を使用して制御したいビデオ (13 分間) があります。ユーザーが再生したいビデオの部分を制御および選択できるようにしたいと考えています。できれば、この制御は 2 つの入力フィールドを介して行われます。最初のボックスに開始時間 (秒単位) を入力し、2 番目のボックスに再生時間 (秒単位) を入力します。たとえば、ビデオを 10 秒後に開始して 15 秒間再生したい場合があります。これを行うために必要な Javascript に関する提案やガイダンスはありますか?

注:次のことがわかりました。

ただし、特定の時間に開始するだけで、指定された時間ビデオを再生することには対応していません。

4

4 に答える 4

13

timeupdate イベントリスナーを使用できます。

イベント後に開始時間と継続時間を変数に保存しますloadedmetadata。

// Set video element to variable
var video = document.getElementById('player1');

var videoStartTime = 0;
var durationTime = 0;

video.addEventListener('loadedmetadata', function() {
  videoStartTime = 2;
  durationTime = 4;
  this.currentTime = videoStartTime;
}, false);

現在の時間が開始時間と継続時間よりも大きい場合、ビデオを一時停止します。

video.addEventListener('timeupdate', function() {
  if(this.currentTime > videoStartTime + durationTime){
    this.pause();
  }
});
于 2012-06-26T18:06:35.700 に答える