离开后视频停止自动播放 - Barbajs

Question

我正在使用 barba.js 进行页面转换。我的公司页面上有 video 元素，设置为 autoplay、循环播放和静音。当我“最初”加载公司页面时，效果很好。但是，当我离开公司页面然后返回（不刷新页面）时，视频不再自动播放。仅当我“手动重新加载”页面时，视频才会再次开始自动播放。注意：我没有使用任何框架（如 React、Vue 等），只是使用plain JavaScript（vanilla JS）。

 <video loop muted autoplay>
         <source src="VIDEO_LINK" type="video/mp4">
 </video>

我使用 Barba.js 在每个页面转换上重新运行所有 JavaScript 代码。我应该对视频元素做什么？

如何确保视频在导航回页面时继续自动播放，

无需重新加载页面？

提前致谢！

为了确保视频元素在导航回页面时继续“自动播放”，您需要在每次页面转换后重新触发自动播放属性。例如：

document.addEventListener('DOMContentLoaded', function () {
barba.init({
  const video = document.querySelector('video');
  if (video) {
    video.play();
  }
 });
});

Answer 1