使用jQuery重新启动HTML5

Question

我正试图让HTML5视频在点击按钮2秒后重新启动，但似乎不知道如何使用jQuery实现这一点。这就是我所拥有的：

var ctrlRE = $('#control-restart'),
vidMain = $('#main-video')[0];
$(ctrlRE).on('click', function() {
setTimeout( function() {
vidMain.pause();
vidMain.currentTime = 0;
vidMain.play();
}, 2000);
});

在这个HTML:上

<video id="main-video" width="640" height="360" muted preload="auto" playsinline>
<source src="video/spin-animation.mp4" type="video/mp4">
</video>
<div id="control-restart">
Restart
</div>

但这似乎只是播放和暂停视频，而实际上并没有跳回到开头。

Answer 1

希望这对您有所帮助。

function restartVid(videoId) {
	var vid = document.getElementById('videoId');
	vid.currentTime = 0;
	vid.play();
}

<video id="videoId" width="400" controls>
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
<source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
Your browser does not support HTML5 video.
</video>
<div onclick="restartVid()">Restart</div>