2016-09-19 4 views
0

Я пытаюсь приостановить видео, а затем возобновить воспроизведение. Но я полагаю, что мне нужно как-то очистить функцию паузы? Я пробовал итерации myVideo.play(), и я могу заставить его играть, но только для коротких всплесков. Любая помощь будет приветствоваться.Возобновить воспроизведение видео после паузы в JavaScript/HTML5?

<!DOCTYPE html> 
<html> 
<head> 
<title> Html5 Video Test </title> 
<meta charset="UTF-8"> 
</head> 

<body> < 
<div style="text-align:center"> 

    <button onclick="playPause()">Play/Pause</button> 

    <video id="video1" width="420" autoplay> 

    <source src="test.mov" type="video/mov"> 
    <source src="test.mp4" type="video/mp4"> 
    Your browser does not support HTML5 video. 
    </video> 
</div> 

<script> 


var myVideo = document.getElementById("video1"); 

myVideo.addEventListener("timeupdate", function(){ 
    if(this.currentTime >= 1 * 2) { 
     this.pause(); 
    } 
}); 

</script> 
</body> 
</html> 

ответ

1

Если я правильно понимаю, вы хотите, чтобы ваш слушатель события активироваться только один раз (так что, когда вы в следующий раз играть в видео, это не просто сразу получить паузу снова). Если да, сделайте снимок:

var myVideo = document.getElementById("video1"); 

// Give this function a name so we can refer to it later. 
function pauseOnce() { 
    if (this.currentTime >= 1 * 2) { 
     this.pause(); 

     // Our work is done. Remove the event listener. (We need a reference to 
     // the function here.) 
     this.removeEventListener("timeupdate", pauseOnce); 
    } 
} 

myVideo.addEventListener("timeupdate", pauseOnce); 
+0

Благодарим за помощь, очень полезно. Я попробую это и посмотрю, как это происходит. Cheers J –

+0

Спасибо, после немного возиться я аха'д и понял, что мне, очевидно, нужно добавить функцию, которая снова возобновит видео. Я понимаю, что это, вероятно, очевидно для многих, но поскольку я охотился на ответ о том, как приостановить/возобновить видео html5, я добавляю, что это как комментарий. После приведенного выше кода @smarx добавьте следующую функцию с ассоциированной кнопкой html. 'function resume() { vid.play(); } ' –

Смежные вопросы