HTML5視頻 - 測量播放

Question

是否可以測量'視頻'標籤的觀看時間？我發現它有'播放'和'暫停'事件，所以我可能會僞造一個計時器。

只是想知道是否還有更多我缺少的東西。

Answer 1

HTML5媒體元素火 'timeupdate' 事件。見http://dev.w3.org/html5/spec/media-elements.html#event-mediacontroller-timeupdate。當該事件觸發時，您可以檢查當前時間的.currentTime和視頻長度的.duration。它也會觸發'durationchange'事件。

全部HTML5媒體DOM接口規格：http://dev.w3.org/html5/spec/media-elements.html

Answer 2

videoElement.currentTime 

Try it on jsFiddle!

來源：https://developer.mozilla.org/en-US/docs/DOM/HTMLMediaElement

Answer 3

我試圖完成一個項目我工作的同樣的事情。 我用jquery stopwatch plugin做了。

這是JS，你將需要：

var w = new Stopwatch(); 

document.querySelector("#video").addEventListener("playing", Start, false); 
document.querySelector("#video").addEventListener("pause", Stop, false); 
document.querySelector("#video").addEventListener("waiting", Stop, false); 

function Start() { 
    if ($("#video").get(0).paused == true) 
     Stop(); 
    else 
     w.start(); 
} 

function Stop() { 
    w.stop(); 
} 

這是你如何讓經過的視圖時間（毫秒）：

var e = w.getElapsed(); 
time = (((e.hours * 3600) + (e.minutes * 60) + e.seconds) * 1000 + e.milliseconds); // Total view time 

請記住 - 這不是最準確的方式來做到這一點，但這是我用我的編碼技巧完成的最好的方法。

祝你好運！