在 iframe 视频结束时播放视频

为了在 iframe 视频结束时播放视频，我们需要通过 JavaScript 来监听视频的状态。

监听视频状态

我们可以通过 iframe 元素中的 contentWindow 属性来获取嵌入视频的文档对象。然后，我们可以使用 contentWindow 对象的 addEventListener 方法来监听视频状态的变化。

const iframe = document.getElementById('my-iframe');
const video = iframe.contentWindow.document.getElementById('my-video');

video.addEventListener('ended', function() {
  // 在视频结束时播放视频
});

在这个示例中，我们首先获取了 iframe 元素和视频元素。然后，我们使用 video 元素的 addEventListener 方法来监听 ended 事件。当视频播放结束时，将触发这个事件处理程序。

播放视频

我们可以使用 src 属性来设置新视频的 URL。然后，我们可以使用 load 方法来加载新视频并开始播放。

const iframe = document.getElementById('my-iframe');
const video = iframe.contentWindow.document.getElementById('my-video');

video.addEventListener('ended', function() {
  const newVideoUrl = 'https://example.com/new-video.mp4';
  video.src = newVideoUrl;
  video.load();
});

在这个示例中，我们设置 newVideoUrl 变量来存储新视频的 URL。然后，我们设置 video 元素的 src 属性为这个 URL。最后，我们调用 load 方法来加载新视频并开始播放。

完整代码

下面是一个完整的代码示例，演示了如何在 iframe 视频结束时播放视频。

<iframe id="my-iframe" src="video.html"></iframe>

<script>
  const iframe = document.getElementById('my-iframe');
  const video = iframe.contentWindow.document.getElementById('my-video');

  video.addEventListener('ended', function() {
    const newVideoUrl = 'https://example.com/new-video.mp4';
    video.src = newVideoUrl;
    video.load();
  });
</script>

在这个示例中，我们嵌入了一个名为 video.html 的文档，其中包含了一个名为 my-video 的视频元素。然后，我们使用 JavaScript 来监听 ended 事件，从而在视频结束时播放新视频。