设置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”

回答

相关问题