HTML5视频自动循环播放
默认打开页面,自动播放视频,按钮可控制视频的播放和停止
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML5视频自动循环播放</title>
</head>
<body>
<video id="videoID" controls="controls" style="width:500px">
<source src="test.mp4" type="video/mp4"/>
</video>
<br/>
<button id="con" onclick="btn()">开始/暂停 </button>
</body>
<script type="text/javascript">
window.onload = function() {
var local1=document.getElementById('videoID'); //获取,函数执行完成后local内存释放
local1.autoplay = true; // 自动播放
local1.loop = true; // 循环播放
local1.muted=true; // 关闭声音,如果为false,视频无法自动播放
if(local1.paused){ //判断是否处于暂停状态
local1.play(); //开启播放
}else{
local1.pause(); //停止播放
}
}
function btn(){
var local=document.getElementById('videoID'); //获取,函数执行完成后local内存释放
if(local.paused){ //判断是否处于暂停状态
local.play(); //开启播放
}else{
local.pause(); //停止播放
}
}
</script>
</html>