javascript - ビデオhtml5要素の再生イベントは何ですか？

Question

ページにビデオhtml5タグが埋め込まれています。ユーザーが「再生ボタン」をクリックしたときにアクションをトリガーする必要があります。しかし、それを自分の行動に結び付ける方法がわかりません。必要なもののためのイベントはありますか？私はjQueryを使用しています...

ありがとう！

Answer 1

この W3C デモ ページは役に立ちますか? http://www.w3.org/2010/05/video/mediaevents.html再生イベントは単に「再生」であるようです。

例えば：

$('video').bind('play', function (e) {
    // do something
});

また

$('video').on('play', function (e) {
    // do something
});

Answer 2

次のページのコードを使用して削除しました。

<script language="javascript">
    document.addEventListener("DOMContentLoaded", init, false);

    function init() {
        var _video = document.getElementById("video");
        _video.addEventListener("playing", play_clicked, false);
    }

    function play_clicked() {
        alert("play was clicked");
    }
</script>

<video id='video'
  controls preload='none' 
  poster="http://media.w3.org/2010/05/sintel/poster.png">
  <source id='mp4'
    src="http://media.w3.org/2010/05/sintel/trailer.mp4"
    type='video/mp4'>
  <p>Your user agent does not support the HTML5 Video element.</p>
</video>

私が助けることができることを望みました。

Answer 3

HTML5 Video 要素にはonplay、リスナーを追加する追加の手順を必要としない、使用できるイベントがあります。このソリューションも JQuery を必要としません。

var myVid = document.getElementById('video');    
if (myVid !== null) { // Possibility of no video loaded in DOM
    myVid.onplay = function () {
        //do something
    };
}

MDNに完全な詳細があります。