javascript html5 视频在设置 currentTime 后等待 readystate == 4

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/21700063/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 21:29:59  来源:igfitidea点击:

html5 video wait for readystate == 4 after setting currentTime

javascripthtmlvideohtml5-videoreadystate

提问by fsulser

I'm trying to grap some images of a video that is not played. Therefore I use the HTML5 .

我正在尝试抓取未播放的视频的一些图像。因此我使用 HTML5 。

Because I want to grab images that haven't been played, I set

因为我想抓取没有播放过的图片,所以我设置了

video.currentTime = y;

If I now call the grap function it won't work. Because the video.readyStateis 1 (and not 4). If I add at the beginning of the grab function an alert();it works.

如果我现在调用 grap 函数,它将不起作用。因为video.readyState是 1(而不是 4)。如果我在抓取功能的开头添加alert();它就可以了。

I tried to loop until readyState == 4with

我试图循环直到readyState == 4

while(true){
   if(video.readyState == 4){
       grapImage();
   }
}

but this ends up in an endless loop.

但这最终会陷入无限循环。

So how can I wait until readyState == 4?

那我怎么能等到readyState == 4呢?

Thanks

谢谢

采纳答案by fsulser

Ok I solved it with the event listener seeked.

好的,我用事件监听器解决了它seeked

If you change the current time it changes to seekingonce it's finished it goes to seeked. The loadedmetadataevent is also an option, but seekedis the fastest one.

如果您更改当前时间,它会在seeking完成后更改为seeked。该loadedmetadata事件也是一种选择,但seeked速度最快。

Thanks for your help.

谢谢你的帮助。

回答by Luke

Check out http://www.w3.org/2010/05/video/mediaevents.htmlfor relevent events to listen for. Try listening to the 'loadedmetadata' event, rather than setting currentTime immediately after load(), as that indicates that all duration/timing information is loaded for a video ('canplay' also works).

查看http://www.w3.org/2010/05/video/mediaevents.html以了解要收听的相关事件。尝试侦听 'loadedmetadata' 事件,而不是在 load() 之后立即设置 currentTime,因为这表明已为视频加载了所有持续时间/时间信息('canplay' 也适用)。

video.addEventListener('loadedmetadata', function () { console.log('video duration information available'); });

回答by Feng Liu

Use "canplay" for media. According to MDN web docs, media event "canplay" corresponds to the HAVE_ENOUGH_DATA readyState, which is readyState 4.

对媒体使用“canplay”。根据 MDN 网络文档,媒体事件“canplay”对应于 HAVE_ENOUGH_DATA readyState,即 readyState 4。

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events