6

HTML5ビデオのイベントの再生/停止/一時停止を聞くにはどうすればよいですか？私は次のコードで試しました：

$("video").on('play',function(){
    //my code here
});

しかし、それは機能しません。

あるいは、ビデオを停止して開始するクリックをインターセプトすることもできますが（実際には私が好むでしょう）、このコードでさえ機能しません：

$('video').on('click', function(event) {
    //my code here
});

多くの場合、ビデオ要素の上にdivが配置され、イベントの開始と停止が関連付けられていると思いますが、jQueryまたはJavascriptを使用して選択する方法がわかりません。

PSこのコードは、動的に構成されている/私が生成していないページで機能するはずなので、IDまたは特定のクラスを示す要素を参照することはできません。

アップデート

テストしているページにiframe内にビデオがあることに気づきませんでした。構文は私のニーズに最も適しています。

doc.querySelector("video").addEventListener('play', function(e) {
    //my code here
}, true);
4

3 に答える 3

4

ここを参照してください：

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events

それで... ：

$("video")[0].onplay = function () {
    // Do play stuff here
};

お役に立てば幸いです。

于 2013-01-10T23:40:10.710 に答える
1

あなたの最初の試みはうまくいくはずです。ただし、jQuery が実際にビデオ要素を見つけていることを確認する必要があります。ページは動的に生成されるとのことなので、ビデオ要素が追加される前にコードが実行されている可能性があります。これは、スクリプトがドキュメント内でビデオ要素よりも上にある場合にも当てはまります (例: 内<head>)。

そこにあるコードの直前に次のコードを配置して、出力を確認してください。

console.log($("video"));

出力が空の配列の場合、ビデオ要素は見つかりません。スクリプトをページの最後またはDOMContentLoadedイベント内に配置してみてください。または、別のスクリプトがビデオ要素を生成している場合は、スクリプトがそのスクリプトの後に実行されることを確認してください。

あなたの質問に関する他のいくつかのメモ：

stopイベントはありません。メディア イベントの一覧は次のとおりです。

イベントはあなたが望んでいるものではないと思いclickます。これは、ユーザーがビデオのどこをクリックしても発生します: 再生ボタン、音量コントロールなど。

内に配置されているビデオはdiv、これらのイベントに影響を与えるべきではありません。startでとendイベントを開催する理由がわからないdivので、フォローしていないのかもしれません。

于 2013-01-11T01:20:40.880 に答える
0

これを試してみてください！

//Direct
<video id="videoThis" src="blahhh.mp4" onended="yourFunction()"></videoThis>

 -or-

//JavaScript (HTML5)
document.querySelector("#videoThis").addEventListener("ended",yourFunction,false);

 -or-

//jQuery
$("#videoThis").bind("ended",yourFunction);
于 2013-01-10T23:44:00.057 に答える