使用视频标签从HTML中的特定时间戳开始视频(对于大型视频)

Question

我想从特定位置或特定时间戳开始和结束视频(例如15秒开始和20秒结束)。下面是我的代码，它工作良好的小视频，但它不工作的大视频。有谁知道它是如何处理大视频的吗?

<video id="myVideo" width="740px" height="665px"></video>
<script>
var myVideo = document.getElementById('myVideo');
myVideo.setAttribute('src', '../../static/videos/abc.mp4#t=15,20');
</script>

Answer 1

这是你要找的吗?

const video = document.querySelector("video")
const bounds = {
min: duration => 20,
max: duration => duration - 20
}
let intervalId
function clamp() {
const min = bounds.min(video.duration)
const max = bounds.max(video.duration)

if (video.currentTime < min) {
video.currentTime = min
}
if (video.currentTime > max) {
video.currentTime = max
video.pause()
}
}
video.addEventListener("play", event => {
clearInterval(intervalId)
intervalId = setInterval(clamp, 100)
})
video.addEventListener("pause", event => {
clearInterval(intervalId)
})

video {
width: 100%;
}

<video controls preload="metadata">
<source src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" type="video/mp4"/>
Video not supported.
</video>