检查html5视频是否准备就绪

时间:2011-03-03 14:15:07

标签: javascript html5 html5-video

如果HTML5视频已准备好播放,是否会触发JavaScript事件?

5 个答案:

答案 0 :(得分:81)

刚刚遇到过这个问题,虽然它有点老了,但我会为未来的读者发帖(他们;像我一样,可能来自谷歌)。

截至今天,这是html5媒体的事件列表(根据W3C):

  • onabort :将在abort上运行的脚本
  • oncanplay :文件准备好开始播放时运行的脚本(当缓冲区足够开始时)
  • oncanplaythrough :当文件可以一直播放到最后但不暂停缓冲时运行的脚本
  • ondurationchange :当媒体长度发生变化时要运行的脚本
  • onemptied :发生错误并且文件突然不可用(如意外断开连接)时要运行的脚本
  • onended :媒体播放结束时播放的剧本(“感谢收听”等消息的有用事件)
  • onerror :加载文件时发生错误时要运行的脚本
  • onloadeddata :加载媒体数据时要运行的脚本
  • onloadedmetadata :加载元数据(如尺寸和持续时间)时要运行的脚本
  • onloadstart :在实际加载任何内容之前文件开始加载时运行的脚本
  • 暂停:用户或以编程方式暂停媒体时要运行的脚本
  • onplay :媒体准备开始播放时要运行的脚本
  • onplaying :媒体实际开始播放时要运行的脚本
  • onprogress :浏览器正在获取媒体数据时运行的脚本
  • onratechange :每次播放速率发生变化时运行的脚本(例如用户切换到慢动作或快进模式时)
  • onreadystatechange :每次就绪状态发生变化时运行的脚本(就绪状态跟踪媒体数据的状态)
  • onseeked :当seek属性设置为false表示搜索已经结束时运行的脚本
  • onseeking :当seek属性设置为true表示搜索处于活动状态时运行的脚本
  • 已安装:当浏览器因任何原因无法获取媒体数据时要运行的脚本
  • onsuspend :在因任何原因完全加载媒体数据之前停止提取媒体数据时要运行的脚本
  • ontimeupdate :播放位置发生变化时要运行的脚本(例如当用户快速转发到媒体中的其他位置时)
  • onvolumechange :每次更改音量时运行的脚本(包括将音量设置为“静音”)
  • onwaiting :当媒体暂停但预计会恢复时运行的脚本(例如媒体暂停以缓冲更多数据时)。

Dantz正在寻找oncanplay。

希望这有帮助。

答案 1 :(得分:16)

我认为准备回放意味着readyState属性等于HAVE_ENOUGH_DATA常量(数值4)。根据{{​​3}},当readyState属性变为此值时,应触发canplay事件。

答案 2 :(得分:6)

这里的讨论很好......

http://tiffanybbrown.com/2010/07/05/the-html5-video-progress-event/

特别是第一条评论。

基本上,这是在规范中并被删除,因为它与媒体呈现的方式并不完全一致。相反,添加了.buffered。

以下是缓冲使用的示例:

http://hacks.mozilla.org/2010/08/html5-video-buffered-property-available-in-firefox-4/

答案 3 :(得分:2)

视频准备播放时,您需要处理2个事件。

  • canplay:视频准备播放时触发 但缓冲不完整
  • canplaythrough:当视频准备播放和缓冲完成时触发

答案 4 :(得分:0)

我发现http://www.w3.org/TR/html5/video.html#mediaevents非常有用,因为它列出了html5媒体标记时可用的所有事件。