javascript - HTML5 <video> 回调？

Question

我正在为一个客户开发网站，他们坚持使用 HTML5 的视频标签作为他们部分视频内容的传送方式。我目前在 http://videojs.com/ 的帮助下启动并运行了它处理 Internet Explorer Flash 回退。

他们要求我做的一件事是，在视频播放完毕后(它们的长度各不相同)，将它们淡出，然后用一张图片代替视频——把它想象成视频后的海报框。

这可能吗？您可以通过 Javascript 或其他方法获取当前正在播放的电影的时间码吗？我知道 Flowplayer ( http://flowplayer.org/demos/scripting/grow.html ) 有一个 onFinish 函数，这是我应该代替 HTML5 视频方法的路线吗？ IE 用户将获得 Flash 播放器这一事实是否需要两个单独的解决方案？

任何输入将不胜感激。我目前在网站上使用 jQuery，所以如果可能的话，我想将解决方案保留在那个领域。谢谢!

Answer 1

You can view a complete list of events in the spec here .

例如:

$("video").bind("ended", function() {
   alert("I'm done!");
});

您可以像 jQuery 中的任何其他内容一样绑定(bind)到元素上的事件...至于您的评论问题，无论您为 IE 提供什么元素，是的，它需要一个单独的处理程序来处理它提供的任何事件.

另外一个关于timecode的问题，timeupdate事件在播放时发生，durationchange事件在总时长变化时发生。您可以绑定(bind)并使用它们，就像我在上面的 ended 事件中展示的那样。对于 timeupdate，您可能需要 currentTime 属性，对于 durationchange，您可能需要 duration 属性，每个其中你可以直接从 DOM 对象中获取，如下所示:

$("video").bind("durationchange", function() {
   alert("Current duration is: " + this.duration);
});