Javascript 加载时在特定位置启动 HTML5 视频？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5981427/
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
Start HTML5 video at a particular position when loading?
提问by Johnydep
I need HTML5 video to start at certain point. Let's say at time 50 seconds onward.
我需要 HTML5 视频才能在某个时间点开始。假设时间为 50 秒以后。
I tried but its not working as expected. is there something i am doing wrong?
我试过了，但它没有按预期工作。有什么我做错了吗？
Here is the code:
这是代码：
<video id="vid1" width="640" height="360">
<source src="file.webm" type="video/webm" />
Your browser does not support the video tag.
</video>
<script>
document.getElementById('vid1').currentTime = 50;
</script>
When the page loads, it just starts playing from beginning. However if I call this during playback like after some time, it works fine. Is there anything I am missing?
当页面加载时，它只是从头开始播放。但是，如果我在播放过程中调用它一段时间后，它工作正常。有什么我想念的吗？
回答by Richard M
You have to wait until the browser knows the duration of the video before you can seek to a particular time. So, I think you want to wait for the 'loadedmetadata' event something like this:
您必须等到浏览器知道视频的持续时间，然后才能搜索特定时间。所以，我认为你想等待 'loadedmetadata' 事件是这样的：
document.getElementById('vid1').addEventListener('loadedmetadata', function() {
this.currentTime = 50;
}, false);
回答by rlovtang
You can link directly with Media Fragments URI, just change the filename to file.webm#t=50
您可以直接与Media Fragments URI链接，只需将文件名更改为file.webm#t=50
This is pretty cool, you can do all sorts of things. But I don't know the current state of browser support.
这很酷，你可以做各种各样的事情。但我不知道浏览器支持的当前状态。
回答by anita
WITHOUT USING JAVASCRIPT
不使用 JAVASCRIPT
Just add #t=[(start_time), (end_time)]to the end of your media URL. The only setback (if you want to see it that way) is you'll need to know how long your video is to indicate the end time.
Example:
只需添加#t=[(start_time), (end_time)]到媒体 URL 的末尾即可。唯一的挫折（如果你想那样看）是你需要知道你的视频有多长才能表明结束时间。
例子：
<video>
<source src="splash.mp4#t=10,20" type="video/mp4">
</video>
Notes:Not supported in IE
注意：IE 不支持
回答by BobK
adjust video start and end time when using the video tag in html5;
在html5中使用video标签时调整视频的开始和结束时间；
http://www.yoursite.com/yourfolder/yourfile.mp4#t=5,15
http://www.yoursite.com/yourfolder/yourfile.mp4#t=5,15
where left of comma is start time in seconds, right of comma is end time in seconds. drop the comma and end time to effect the start time only.
其中逗号左边是以秒为单位的开始时间，逗号右边是以秒为单位的结束时间。删除逗号和结束时间以仅影响开始时间。
回答by Kamila
Using a #t=10,20fragment worked for me.
使用#t=10,20片段对我有用。
回答by Robert Reinhardt
On Safari Mac for an HLS source, I needed to use the loadeddata event instead of the metadata event.
在 Safari Mac 上为 HLS 源，我需要使用加载数据事件而不是元数据事件。
