30

HTML5 オーディオを使用して単純なループ機能を作成しようとしていますが、次のような非常に原始的なソリューションがあります。

$(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 ドキュメントを見つけることができませんでした...しかし、これを行う方法があるかどうか知りたいです。

4

2 に答える 2

56

ビデオの currentTime プロパティをより頻繁に読み取ることができることに注意してください。時間が非常に重要であり、少しの不確実性に耐えることができる場合は、代わりにこれを試すことができます.

timeupdateただし、タグ自体のイベントを使用するよりもはるかにエレガントではありません。

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

nullこの場合、間隔を自分で管理する必要があります。オーディオ要素を ing する前に、必ず間隔をクリアしてください。しかし、それは可能性です。

私はビデオ要素でこのアプローチを使用していますが、ここでも適用する必要があります。

于 2014-01-27T16:06:41.967 に答える
29

申し訳ありませんが、それが機能する方法です。html5仕様から：

15 ～ 250 ミリ秒ごと、または MediaController のメディア コントローラーの位置が変化するたびに、発生頻度の低い方で、ユーザー エージェントはタスクをキューに入れ、MediaController で timeupdate という名前の単純なイベントを発生させる必要があります。

また、

したがって、イベントは、約 66Hz よりも速く、または 4Hz よりも遅く発生することはありません (イベント ハンドラの実行に 250 ミリ秒以上かからないことを前提としています)。ユーザー エージェントは、システム負荷と毎回イベントを処理する平均コストに基づいてイベントの頻度を変えることをお勧めします。これにより、ユーザー エージェントがビデオのデコード中に快適に処理できる以上の頻度で UI の更新が行われることはありません。

仕様を読むと、timeupdateイベントは「ベスト エフォート」のようなものであることがわかります。パフォーマンスにあまり影響を与えない限り、可能なときにいつでも起動します。

イベントをフィルタリングして、時々いくつかを破棄して到着時間をスムーズにすることもできますが、残念ながらその逆は不可能です。

于 2012-09-07T22:00:32.647 に答える