HTML5 视频元素，开始和结束时间。

Question

我有一个HTML5视频元素。

 <video id="video" loop="loop">
   <source src="src.mov">
</video>

我希望视频从特定的时间开始（比如说...10秒）并在特定的时间结束（27秒）。

我知道你可以用JavaScript做到这一点，但是我想在html中实现。视频元素是否有开始/结束时间标签？

- Ian Wise

---

那很不错对于 JavaScript，但在 HTML 中可能吗？ - Ian Wise

指定播放范围的方法不需要 JavaScript。尝试在浏览器中禁用 JavaScript，然后加载此页面。请注意，视频在加载时会跳转到 20 秒处。（该页面上的其他功能确实需要 JavaScript。例如，“跳转”按钮没有它是无法工作的。） - showdev

Answer 1

你可以通过在源URL后附加开始时间和结束时间来指定播放范围。

时间格式应为：

#t=[starttime][,endtime]

来自MDN：

媒体元素URI规范的播放范围部分被添加到Gecko 9.0（Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6）。

以下是一个示例，从第2秒开始播放视频，到第3秒结束：

<video controls autoplay> 
  <source src=http://techslides.com/demos/sample-videos/small.webm#t=2,3 type=video/webm> 
  <source src=http://techslides.com/demos/sample-videos/small.ogv#t=2,3 type=video/ogg> 
  <source src=http://techslides.com/demos/sample-videos/small.mp4#t=2,3 type=video/mp4>
  <source src=http://techslides.com/demos/sample-videos/small.3gp#t=2,3 type=video/3gp>
</video>

参考资料：

媒体片段URI的时间维度
Mozilla整合记录（bug 648595）

示例视频来自techslides.com

- showdev

---

谢谢！这个很好用！但我有一个问题，我的视频一直在循环播放，每次循环到开头重新开始。你知道怎么让它从指定的位置开始吗？再次感谢！ - Ian Wise

不幸的是，我没有找到一种在没有JavaScript的情况下循环片段的方法。但是，我确实在这里找到了一些关于困难的讨论。 - showdev

这里不起作用。即使我添加了#start和#end，也没有显示工作。 - Fernando Torres

@FernandoTorres 你可能想要发布一个新问题来展示你的代码和出现了什么问题。如果有帮助的话，可以参考这个问题。 - showdev