2010-05-28 37 views
6

我试图对video标记的HTML 5 onended事件做出反应,但没有成功。在下面的代码片段中,我添加了mouseleave事件以确保jQuery代码正确,并且该事件确实激活了alert()框。HTML 5视频已停播不支持的事件

视频播放还不错,但我没有收到onended事件(我的alert()未触发)。

在Chrome中进行测试,今日更新至版本5.0.375.55。

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $("#myVideoTag").bind('mouseleave onended', function(){ 
     alert("All done, function!"); 
    }); 
}); 

</script> 
</head> 
<body> 
<video id="myVideoTag" width="640" height="360" poster="Fractal-zoom-1-04-Snowflake.jpg" controls> 
    <source src="Fractal-zoom-1-04-Snowflake.mp4" type="video/mp4"></source> 
    <source src="Fractal-zoom-1-04-Snowflake.ogg" type="video/ogg"></source> 
</video> 

<body> 
<html> 

回答

17

确保您绑定到ended事件,而不是onended,要始终保持on出与jQuery结合时,例如,你不能这样做.on("onclick"),你会做.on("click")

如果有帮助,有可用的事件为<video>元素在这里的完整列表:http://www.w3.org/2010/05/video/mediaevents.html

+1

另外请记住,事件不会在ie9 mobile for Windows Phone Mobile上被解雇。 – Timo 2012-05-03 12:26:50

+1

两年后,它仍然是草稿规范草稿编辑草案2012年6月26日 – 2012-07-05 01:18:18

+1

使3年后:编辑草案2013年7月30日 – 2013-07-30 10:55:06

2

我太寻找答案此。下面是我为jQuery移动框架所发挥的作用:

$(document).ready(function(){ 
    $("#idname").bind('ended', function(){ 
    $.mobile.changePage($('#idofpageyouwantogoto'), 'fade'); 
    }); 
});