检查HTML5视频是否就绪

Question

49

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

- dantz

5个回答

21

我理解"ready for playback"代表的是readyState属性等于HAVE_ENOUGH_DATA常量（数值为4）。根据文档所述，当readyState属性变成这个值时，应该触发canplay事件。

- Olivier Amblet

1

嗯，你确定吗？我认为与HAVE_ENOUGH_DATA相关的正确事件是'canplaythrough'。http://www.w3.org/TR/html5/embedded-content-0.html#event-media-canplaythrough - arxpoetica

看起来这份草案自2011年以来已经发生了变化 :）。我同意你的观点，即当readyState转换为HAVE_ENOUGH_DATA时，事件被触发。 - Olivier Amblet

根据我的经验，移动版Safari中的canplaythrough事件不够可靠。 - Stephen Tetreault

1

使用 $('#someid').on('canplay', function () { /* 你的代码 */ }); 进行jQuery访问。 - Roland

6

这里有很好的讨论...

特别是第一个评论。

基本上，这个事件在规范中出现过，但被移除了，因为它与媒体渲染方式并不完全相符。代替它的是 .buffered 属性。

以下是 buffered 属性的使用示例:

- Brandon Frohbieter

2

当视频准备好播放时，您有两个事件需要处理。

- Yann L.

1

我发现http://www.w3.org/TR/html5/video.html#mediaevents非常有用，因为它列出了所有与HTML5媒体标签相关的事件。

- boz

2

链接显示404页面未找到 - 这就是为什么不直接链接到可能的答案，而是在这里发布答案的原因。 - kontur

你可以在这里找到类似的列表：https://developer.mozilla.org/zh-CN/docs/Web/Guide/Events/Media_events。 - Wex

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- MeanMatt · Accepted Answer

我刚看到这个问题，虽然它有点老了，但我还是为未来的读者（像我一样，可能来自Google）发布这个答案。

截至今天，以下是符合W3C标准的html5媒体事件列表：

onratechange : 当播放速率发生变化时运行的脚本（例如当用户切换到慢动作或快进模式时）

onreadystatechange : 当就绪状态（ready state）发生变化时运行的脚本（就绪状态跟踪媒体数据的状态）

onseeked : 当寻找属性被设置为false表示寻找已结束时运行的脚本

onseeking : 当寻找属性被设置为true表示寻找正在进行时运行的脚本

onstalled : 当浏览器由于某种原因无法获取媒体数据时运行的脚本

onsuspend : 当获取媒体数据在完全加载之前停止时运行的脚本，原因可能是任何原因

ontimeupdate : 当播放位置发生更改时（例如当用户快进到媒体的不同点时）运行的脚本

onvolumechange : 每次音量发生变化时运行的脚本（包括将音量设置为“静音”）

onwaiting : 当媒体已暂停但预计会恢复播放时（例如当媒体暂停以缓冲更多数据）运行的脚本。

Dantz正在寻找oncanplaythrough。