html5 listener loadeddata不能正常工作

Question

我很绝望.为什么这样有效:

var myVid=document.getElementById("movie");
myVid.onloadeddata=console.log("Browser has loaded the current frame");

而这不是:

myVid.addEventListener("loadeddata", function()  {
  alert("loadeddata");
  });

在Firefox 27中都尝试过.

她在我的页面上大喊: www.x.opteynde.com

我的目标是获取视频的加载时间.

Answer 1

var myVid = document.getElementById("movie");
myVid.onloadeddata = console.log("Browser has loaded the current frame");

这不符合您的期望.你没有绑定一个函数myVid.onloadeddata,你正在立即执行console.log(),并设置它的返回值myVid.onloadeddata.

正确的方法是:

myVid.onloadeddata = function() {
    console.log("Browser has loaded the current frame");
}

所以这可以解释为什么这会在你的控制台输出一些东西.

到loadeddata:

本的定义loadeddata为:

用户代理可以第一次在当前回放位置呈现媒体数据.

在稍微不那么正式的讲话中,这意味着:"用户代理可以呈现至少一帧实际视频".

在我的Firefox错误控制台中,我看到以下错误:

Specified "type" attribute of "video/mp4" is not supported. Load of media resource fliege.mp4 failed.
HTTP load failed with status 404. Load of media resource http://www.x.opteynde.com/fliege.ogv failed.
All candidate resources failed to load. Media load paused.

显然,Firefox无法从无法加载的视频渲染帧,所以这404似乎是你的问题.

PS
另请注意,在您单击"播放"按钮之前,此示例 loadeddata不会被触发.

Answer 2

经过两天的搜索，我找到了解决方案。要触发事件，它必须是 video.load() 之前。html-video-markup 中的循环和自动播放标签还不够。