2016-05-30 8 views
1

あたり何千回をトリガ私は私のページのonload関数の次のjQueryコードを持っている:動画canplayイベントが第二

$("#vid-pages").find("video").on('canplay', function() { 
    $(this)[0].currentTime = $(this)[0].duration/2; 
    console.log($(this)[0].currentTime); 
}); 

2つだけ、そのコンテナ内の動画、およびページ上のどこか他のどれもがあります。コンソールをチェックすると、そのコードブロックに返された時間が継続的にあふれています。このトリガーを常時ではなく1回だけ行うソリューションは何ですか?

答えて

2

現在の時刻が変更されると、ブラウザはキャッシュまたはネットワークからさらにデータをロードする必要があります。これにより、canplayイベントがトリガーされます。そして、イベントハンドラに時間が設定されてから、無限ループが発生します(ビデオを選択して再生し、その直後にスキップするとhereの効果が得られます)。ブラウザによって異なる場合があります。 MDNの

This page(全く同じではないが、Firefoxを使用してメディアイベントのページに示すように、これはまたcanplayに適用されると考えていることが妥当である) canplaythrough関連に次のことを述べている:

注:currentTimeを手動で設定すると、最終的にfirefoxで canplaythroughイベントが発生します。他のブラウザはこの イベントを発生させないことがあります。

いずれかの回避イベントを解除、またはイベントがトリガされた2回目の出口を強制フラグを使用します。

var initialPlay = false; 

$("#vid-pages").find("video").on('canplay', function() { 
    if (initialPlay) return; 
    initialPlay = true; 

    $(this)[0].currentTime = $(this)[0].duration/2; 
    console.log($(this)[0].currentTime); 
}); 

登録を解除するには、非匿名機能を使用する必要があります。