如何獲取HTML5視訊的持續時間

鐵錨發表於2015-03-14
HTML

HTML5視訊的Bigger體驗是非常令人振奮的,很簡單的道理，不用載入和依賴煩人的Flash或其他第三方外掛來播放視訊，也是大功一件。我們可以通過自定義控制元件對視訊進行顯示和操控,其中一個常見的需求是顯示視訊的時長(duration)。下面我們一起來看看如何獲得並顯示視訊的持續時間!

JavaScript 程式碼

video 元素有一個屬性(property)叫做 duration,表示的是視訊內容的時間長度,單位是秒。要比較好地顯示視訊的持續時間，我們需要使用到 parseInt 函式，以及取模運算(% , modulus )：

//  假設"video" 是獲取的視訊節點物件
var i = setInterval(function() {
    // 這裡注意, 必須判斷視訊的 readyState。
    // 因為有可能沒載入完，則獲取到的視訊時長資訊是不正確的。
    if(video.readyState > 0) {
        // 計算,10進位制，以及取模
        var minutes = parseInt(video.duration / 60, 10);
        var seconds = video.duration % 60;

        // (此處可以新增程式碼，將分鐘，秒數顯示到需要的地方)
        // ...
        // 執行到這裡，就將迴圈定時器清除。
        clearInterval(i);
    }
}, 200);

原文連結: Get HTML5 Video Duration

原文日期: 2015年03月10日

翻譯日期: 2015年03月14日

翻譯人員: 鐵錨 http://blog.csdn.net/renfufei


相關文章