javascript-如何得知元素内的视频已完全加载？

我想通过jQuery或Javascript检测何时完全加载了html5标签内的特定视频(我是说,已下载到浏览器的缓存中).该视频具有preload =“ auto”属性.

我竭尽所能做到这一点(我是初学者),但没有运气.似乎找不到我可以听的任何事件,有什么办法可以做到这一点？

PS：我遇到的唯一一件事是视频对象的network_state属性,但是网络上的引用似乎与它返回的状态不一致,当我尝试它时,我没有找到“ LOADED”的状态”.

编辑：我发现我可以使用的事件canPlayThrough.我对其进行了测试,并且似乎可以正常工作,但是我不确定它是否真的告诉我该视频已完全加载,或者只是加载了足以开始播放的数据(不好).

解决方法:

您可以绑定到结束事件：

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

其中eventname是您要列出的事件

事件的完整列表在这里-> http://dev.w3.org/html5/spec/Overview.html#mediaevents

更新 ：

要获取百分比加载,可以结合使用以下两个事件：

$("video").bind('durationchange', checkProgress);
$("video").bind('progress', checkProgress);

function updateSeekable() {
  var percentageComplete = (100 / (this.duration || 1) *
    ($(this).seekable && $(this).seekable.length ? $(this).seekable.end : 0)) + '%';
}

标签：html5,html5-video,javascript,jquery
来源： https://codeday.me/bug/20191102/1988262.html