什么是视频html5元素上的播放事件?

时间:2012-10-01 20:18:33

标签: javascript jquery html5-video

我在页面上嵌入了一个视频html5标签。我需要在用户点击“播放按钮”时触发操作。但是我找不到如何将它绑定到我的动作上。是否有我需要的活动?我正在使用jQuery ......

谢谢!

3 个答案:

答案 0 :(得分:23)

这个W3C演示页面有帮助吗? http://www.w3.org/2010/05/video/mediaevents.html播放事件似乎只是“播放”。

例如:

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

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

答案 1 :(得分:6)

我使用了以下page中的代码并将其删除:

<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>

希望我能提供帮助。

答案 2 :(得分:4)

HTML5视频元素有一个onplay事件,您可以使用它不需要添加侦听器的额外步骤。该解决方案也不需要JQuery。

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

MDN有详细信息。