Перезапустите HTML5, используя jQuery

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>