在JavaScript/HTML5中暫停後恢復視頻播放？

我試圖暫停視頻，然後恢復播放。但我認爲我需要清除暫停功能？我已經嘗試了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>

來源

2016-09-19 johan englund

如果我理解正確的，你希望你的事件監聽器只需要激活一次（所以，當你下次播放視頻，它不只是立即再次獲得暫停）。如果是這樣，給這個鏡頭：

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);

來源

2016-09-19 17:18:06 smarx

謝謝你的幫助，非常有用。我會試試看看它是如何發展的。乾杯J –

謝謝，經過一番小小的擺弄之後，我發現自己明顯需要添加一個可以重新開始視頻的功能。我意識到這很可能是很明顯的，但正如我一直在尋找關於如何暫停/恢復html5視頻的答案，我補充說這是一個後續評論。在上面的@smarx代碼之後，添加下面的函數和一個關聯的html按鈕。 'function resume（）{ vid.play（）; }' –

在JavaScript/HTML5中暫停後恢復視頻播放？

回答

相關問題