
新建独立页面
输入以下代码,视频地址自己编辑
<video id="vid" autoplay muted controls playsinline style="width:100%;max-height:650px;height:auto;display:block;" controlslist="nodownload"></video>
<button id="nextBtn" style="display:block;width:100%;margin-top:0px;padding:8px;font-size:1rem; font-weight: bold;">换一个</button>
<script>
const lib = [
{ id: 1, url: "https://s3.hi168.com/hi168-31594-1608plyt/video/20260511-1.mp4" },
{ id: 2, url: "https://s3.hi168.com/hi168-31594-1608plyt/video/20260511-2.mp4" },
{ id: 3, url: "https://s3.hi168.com/hi168-31594-1608plyt/video/20260511-3.mp4" },
{ id: 4, url: "https://s3.hi168.com/hi168-31594-1608plyt/video/Hina%20Kikuchi.mp4" },
{ id: 5, url: "https://s3.hi168.com/hi168-31594-1608plyt/video/Kikuchi%20Hina.mp4" }
];
const video = document.getElementById('vid');
const nextBtn = document.getElementById('nextBtn');
let currentVideoObj = null;
function getRandomVideo() {
return lib[Math.floor(Math.random() * lib.length)];
}
function getDifferentVideo(current) {
if (!current) return getRandomVideo();
if (lib.length === 1) return lib[0];
let newVideo = getRandomVideo();
while (newVideo.id === current.id) newVideo = getRandomVideo();
return newVideo;
}
function loadVideo(videoObj) {
currentVideoObj = videoObj;
video.src = videoObj.url;
video.load();
video.play().catch(e => console.log("自动播放需要交互", e));
}
function nextVideo() {
const newVideo = getDifferentVideo(currentVideoObj);
loadVideo(newVideo);
}
loadVideo(getRandomVideo());
video.muted = true;
nextBtn.addEventListener('click', nextVideo);
video.addEventListener('ended', nextVideo);
</script>
暂无评论