我如何开始html5视频暂停,然后在用户开始视频然后自动播放

How do I Start html5 video paused then after user begins video then autoplay?

本文关键字:开始 然后 视频 暂停 自动播放 用户 html5 何开始      更新时间:2023-09-26

创建了一个html5视频播放列表。当页面第一次加载时,我希望视频暂停,这样用户就可以选择开始自动播放序列。

代码:

<!DOCTYPE html> 
<html> 
<head> 
<script type='text/javascript'>//<![CDATA[ 
window.onload=function(){
var videoPlayer= document.getElementById('video');
videoPlayer.addEventListener('ended', function(){
this.pause();
this.src = "http://www.mp4point.com/downloads/8feeca1a540b.mp4";
}, false);
}//]]>  
</script> 

</head> 
<body> 
  <video id="video" src="http://media.w3.org/2010/05/sintel/trailer.mp4" autoplay autobuffer controls /> 
</body> 

</html> 

Jsfiddle: http://jsfiddle.net/3uRq6/7/

看起来你需要颠倒你的逻辑。从<video>中删除autoplay属性,然后在事件侦听器中更改src,然后播放视频。

http://jsfiddle.net/3uRq6/9/

<!DOCTYPE html> 
<html> 
<head> 
<script type='text/javascript'>//<![CDATA[ 
window.onload=function(){
var videoPlayer= document.getElementById('video');
videoPlayer.addEventListener('ended', function(){
    this.src = "http://www.mp4point.com/downloads/8feeca1a540b.mp4";
    this.play();
}, false);
}//]]>  
</script> 

</head> 
<body> 
  <video id="video" src="http://media.w3.org/2010/05/sintel/trailer.mp4" autobuffer controls /> 
</body> 

</html>