Javascript 等待视频完成以转到幻灯片放映的下一张幻灯片？
我正在尝试用图片和视频制作幻灯片，当它到达视频幻灯片时，我希望它停止，播放视频并等待它完成。然后进入下一张幻灯片 为了解决这个问题，我尝试在html5的视频元素的函数play（）上使用Promiss，就像这里的示例一样 但是，promisse中的代码不会执行，并且在警报中显示未定义的消息 有人可以帮我吗 index.htmlJavascript 等待视频完成以转到幻灯片放映的下一张幻灯片？,javascript,slideshow,Javascript,Slideshow,我正在尝试用图片和视频制作幻灯片，当它到达视频幻灯片时，我希望它停止，播放视频并等待它完成。然后进入下一张幻灯片 为了解决这个问题，我尝试在html5的视频元素的函数play（）上使用Promiss，就像这里的示例一样 但是，promisse中的代码不会执行，并且在警报中显示未定义的消息 有人可以帮我吗 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" type="text/css" href="index.css" />
<title>Ricardo Ambrosio</title>
</head>
<body>
<div class="top-nav">
<ul>
<li><a class="active" href="#perfil">QUEM SOU EU?</a></li>
<li><a href="#programa">COMO FUNCIONA?</a></li>
<li><a href="#alunos">MEUS ALUNOS</a></li>
<li><a href="#planos">PLANOS E PREÇOS</a></li>
<li><a href="#faq">FAQ</a></li>
<li><a href="#presencial">ATENDIMENTO PRESENCIAL</a></li>
<li><a href="#blog">BLOG</a></li>
</ul>
</div>
<div class="slideshow-container">
<div class="mySlides fade">
<div class="img1">
<img src="/images/banner-1.jpg" />
</div>
</div>
</div>
<div class="slideshow-container">
<div class="mySlides fade">
<img src="/images/banner-2.jpg" />
</div>
</div>
<div class="slideshow-container">
<div class="mySlides fade">
<img src="/images/banner-3.jpg" />
</div>
</div>
<div class="slideshow-container">
<div class="mySlides fade">
<video id="video" width="1550" height="500">
<source src="/videos/443474440.mp4" type="video/mp4" />
</video>
</div>
</div>
<button class="w3 button w3-display-left next" onclick="plusSlides(1)">
❯
</button>
<button class="w3 button w3-display-left prev" onclick="plusSlides(-1)">
❮
</button>
<script src="index.js"></script>
</body>
</html>
里卡多·安布罗西奥
❯
❮
let video = document.getElementById("video");
var slideIndex = 1;
showSlides(slideIndex);
function plusSlides(n) {
showSlides((slideIndex += n));
}
video.addEventListener("ended", function() {
setTimeout(showSlides, 1000);
});
video.addEventListener("click", function() {
if (video.paused) {
video.play();
video.volume = 1;
} else {
video.pause();
video.volume = 0;
}
});
async function playPause() {
video.play();
video.volume = 0;
}
async function showSlides(n) {
var i;
var slides = document.getElementsByClassName("mySlides");
if (n > slides.length) {
slideIndex = 1;
}
if (n < 1) {
slideIndex = slides.length;
}
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slides[slideIndex - 1].style.display = "block";
if (slideIndex == 4) {
playPause();
} else {
setTimeout(showSlides, 2000);
}
}
let video=document.getElementById（“视频”）；
var slideIndex=1；
放映幻灯片（幻灯片索引）；
函数加滑块（n）{
放映幻灯片（（幻灯片索引+=n））；
}
video.addEventListener（“结束”，函数（）{
设置超时（显示幻灯片，1000）；
});
video.addEventListener（“单击”，函数（）{
如果（视频暂停）{
video.play（）；
video.volume=1；
}否则{
video.pause（）；
video.volume=0；
}
});
异步函数playPause（）{
video.play（）；
video.volume=0；
}
异步函数显示幻灯片（n）{
var i；
var slides=document.getElementsByClassName（“mySlides”）；
如果（n>幻灯片长度）{
slideIndex=1；
}
if（n<1）{
slideIndex=slides.length；
}
对于（i=0；i