HTML 5 视频 OnEnded 事件未触发
我试图对 video
标记的 HTML 5 onished
事件做出反应,但没有成功。在下面的代码片段中,我添加了 mouseleave 事件,以确保 jQuery 代码正确并且该事件确实激活 alert()
框。
视频播放得很好,但我没有收到 onending
事件(我的 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>
I'm trying to react to the HTML 5 onended
event for the video
tag without success. In the code snippet below I added the mouseleave event to be sure the jQuery code is correct and that event does activate the alert()
box.
The video plays just fine but I am not receiving the onended
event (my alert()
does not fire).
Testing in Chrome, updated today to version 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>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
确保您绑定到
ending
事件而不是onished
,在与 jQuery 绑定时始终保留on
,例如您不能'如果不执行.on("onclick")
,则应执行.on("click")
。如果有帮助,这里有
元素的可用事件的完整列表:http://www.w3.org/2010/05/video/mediaevents.html
Make sure you're binding to the
ended
event instead ofonended
, always leave theon
out when binding with jQuery, for example you couldn't do.on("onclick")
, you'd do.on("click")
.If it helps, there's a full listing of available events for the
<video>
element here: http://www.w3.org/2010/05/video/mediaevents.html我也在寻找这个问题的答案。以下是 jQuery 移动框架对我有用的内容:
I was searching for the answer for this too. Here's what worked for me in for the jQuery mobile framework: