在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中暂停后恢复视频播放？

回答

相关问题