設置HTML5音頻事件「timeupdate」

我嘗試使用HTML5音頻按照以下步驟創建一個簡單的循環功能，並有一個非常原始的解決方案的粒度：設置HTML5音頻事件「timeupdate」

$(audio).bind('timeupdate', function() { 
    if (audio.currentTime >= 26){ 
    var blah = audio.currentTime; 
    audio.currentTime = 23; 
    console.log(blah); 
    } 
})

也能正常工作，但唯一問題這裏是timeupdate事件不會非常一致地觸發。舉例來說，上面的console.log返回： 26.14031982421875

26.229642868041992

26.13462257385254

26.21796226501465

...等。（你的想法......不一致的時間）

顯然，這對於時間很重要的應用程序（音樂應用程序）不起作用。所以我明顯的解決方案是增加觸發timeupdate事件的粒度。我還沒有找到任何API文檔......但很想知道是否有辦法做到這一點。

來源

2012-09-07 udit

另請參閱http://stackoverflow.com/questions/24827929/get-frame-numbers-in-html5-video – rogerdpack

當然，它會工作。只需在該位置更新您的洗滌器。 –

對不起，但這是它的工作方式。從html5 specs：

每15至250毫秒，或當的MediaController的媒體控制器的位置變化，兩者取其至少經常，用戶代理必須隊列的任務火在命名的MediaController timeupdate一個簡單的事件。

此外，

事件因而不應被超過4Hz的燒製大於約66Hz更快或更慢（假定事件處理程序不帶長於250ms的運行）。我們鼓勵用戶代理根據系統負載和每次處理事件的平均成本來改變事件的頻率，以便UI更新不會比用戶代理在解碼視頻時可以輕鬆處理的頻率更頻繁。

如果您仔細閱讀規範，就會發現事件是「盡力而爲」事件。只要不影響性能，它會在可能時啓動並始終啓動。

您可以過濾丟棄一些事件的事件以平滑到達時間，但恐怕不可能做相反的事情。

來源

2012-09-07 22:00:32 jbalsas

我記錄了當前時間，並且某個時間間隔超過了500毫秒。對於性能低下的設備，這個間隔是多少？ – Foreever

無論出於何種原因，許多人似乎更喜歡250毫秒 – rogerdpack

應該指出，你可以可以更頻繁地讀取視頻的currentTime屬性。如果時間真的很關鍵，而且你可以忍受一點不確定性，那麼你可以試試這個。

然而，它比使用標籤自己的timeupdate事件要優雅得多。

setInterval(function() { 
    console.log(audio.currentTime); // will get you a lot more updates. 
}, 30);

在這種情況下，你必須自己管理的時間間隔，確保您清除它null之前荷蘭國際集團的音頻元素。但它是的一種可能性。

我在視頻元素上使用這種方法，但它也應該適用於此。

來源

2014-01-27 16:06:41 amenthes

我想知道這是否會嚴重影響性能。 – Foreever

我們在一個cordova項目中使用這個功能，可以同時播放/暫停用戶可以控制的內容層。在那種情況下，我們沒有與它有關的性能問題。但事實確實如此，你現在每隔幾毫秒就有一件事情要做。除了setInterval，您還可以在發生其他事件（如用戶交互）時讀取'.currentTime'。或者，如果您關心視頻位置，但只能在「1分鐘左右」時間內計算「安全餘量」，請設置59秒的超時時間，並在59秒後開始更緊密的時間間隔。 – amenthes

對於較短的音頻剪輯，此方法幾乎不可見 – August

設置HTML5音頻事件「timeupdate」

回答

相關問題