Javascript HTML5 视频暂停和倒带

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7853594/
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-08-24 03:51:03  来源:igfitidea点击:

HTML5 Video pause and rewind

javascriptjqueryhtmlvideo

提问by Alejandro Ar

Is there any way to pause and rewind to 0s a HTML5 video? Or just simply stop?

有什么方法可以暂停 HTML5 视频并将其倒回 0 秒?还是干脆停下来?

I got a jQuery popup, so when someone clicks on it, the popup shows up and the video plays, and when you hit the close button the video pauses. So what I'm trying to do is that if you click again the button to show the popup the video begins in the start position (0 secs).

我有一个 jQuery 弹出窗口,所以当有人点击它时,弹出窗口就会出现并播放视频,当您点击关闭按钮时,视频会暂停。所以我想要做的是,如果您再次单击按钮以显示弹出窗口,视频将从开始位置(0 秒)开始。

Thanks.

谢谢。

回答by Chris Ching

You can get a reference to your jquery video element upon opening it (or closing the popup) and pause it using pause(), and then set the "currentTime" property to 0 to go back to the beginning.

您可以在打开(或关闭弹出窗口)时获取对 jquery 视频元素的引用,并使用 pause() 暂停它,然后将“currentTime”属性设置为 0 以返回到开头。

Here's a reference to the documentationfor currentTime.

这是对 currentTime文档的参考。

here's a code sample:

这是一个代码示例:

var mediaElement = document.getElementById("video"); 
mediaElement.pause(); 
mediaElement.currentTime = 0;

回答by Matyas

To have a proper stop(pause & rewind) functionality you could do the following:

要获得适当的stop(暂停和倒带)功能,您可以执行以下操作:

var video = document.getElementById('vidId');
// or video = $('.video-selector')[0];
video.pause();
video.currentTime = 0;
video.load();

Note: This is the only version that worked for me in chrome using nodejs(meteorjs) in the backend, serving webm& oggfiles

注意:这是在 chrome 中唯一对我有用的版本,在后端、服务和文件中使用nodejs( meteorjs)webmogg

回答by Niet the Dark Absol

Just call the pause()method of the video element. To reset the time, set currentTimeto 0 (or any other value if needed, in seconds).

只需调用pause()视频元素的方法即可。要重置时间,请设置currentTime为 0(或任何其他值,如果需要,以秒为单位)。

回答by ajaxx042

To reset a video to 0 seconds in jQuery:

jQuery中将视频重置为 0 秒:

$('#video')[0].currentTime = 0;

Or, in vanilla JS (Although this has been pointed out above):

或者,在 vanilla JS 中(尽管上面已经指出了这一点):

var video = document.getElementById('video');
video.currentTime = 0;