通过代码，可以在第一个完成后开始第二个视频?或者我必须使用脚本才能起作用

Question

我有2个在<div>中编码的视频链接。我需要代码的帮助，让第二个视频在第一个视频结束后自动播放。

我正在使用CSS和HTML5。

这是代码：

<div class="container2">
  <video controls src="System Software & Application Software.mp4" autoplay></video>
</div>
<div class="container3">
  <video controls src="What is Computer Hardware.mp4"autoplay> </video>
</div>

Answer 1

您需要从第二个视频中删除自动播放，然后在第一个视频上创建一个EventListener，以收听ended事件，然后触发第二个视频播放。例如，使用此HTML：

<div class="container2">
    <video id="video1" controls src="System Software & Application Software.mp4" autoplay> </video>
</div> 
<div class="container3">
    <video id="video2" controls src="What is Computer Hardware.mp4"> </video>
</div>

您的JavaScript看起来像这样：

document.getElementById('video1').addEventListener('ended',function() {
    document.getElementById('video2').play();
},false);