JS视频定时暂停恢复功能故障求助：代码未按预期触发

我正在开发一段JavaScript代码，想要实现视频播放至特定时间后暂停一分钟，随后自动恢复播放的功能，但代码未正常工作。

原代码如下：

const toggleSwitch = document.querySelector('#toggle');
const video = document.querySelector('#myVideo');
toggleSwitch.addEventListener('change', toggleDarkMode);
function toggleDarkMode() {
  if (toggleSwitch.checked) {
    document.body.classList.add('dark-mode');
  } else {
    document.body.classList.remove('dark-mode');
  }
}
video.addEventListener('timeupdate', function() {
  const currentTime = video.currentTime;
  const hours = new Date().getHours();
  const minutes = new Date().getMinutes();
  if (hours === 08 && minutes === 15 && currentTime >= 495 && currentTime < 496) {
    video.pause();
    setTimeout(function() {
      video.play();
    }, 60000);
  }
});

这段代码原本设定为在系统时间8:15、视频播放至495-496秒区间时触发暂停，但并未按指定逻辑生效，希望得到问题排查和修复的帮助，会在网站上署名致谢。

问题排查与修复方案 #

核心问题点

1. 数字字面量错误：代码中hours === 08采用了以0开头的写法，这在JavaScript中属于八进制数字表示，ES5严格模式下会直接报错，非严格模式也存在解析风险，应直接写十进制的8。
2. 重复触发逻辑：timeupdate事件会每秒触发多次，当前逻辑会在495-496秒区间内重复执行暂停和定时器创建操作，导致多个定时器叠加，出现视频刚恢复又被暂停的混乱情况。
3. 时间区间过窄：currentTime >= 495 && currentTime < 496的区间限制过严格，可能因timeupdate的触发时机刚好跳过该区间，导致逻辑完全不执行。

修复后的代码

const toggleSwitch = document.querySelector('#toggle');
const video = document.querySelector('#myVideo');
// 标记是否已触发过暂停逻辑，避免重复执行
let hasTriggeredPause = false;

toggleSwitch.addEventListener('change', toggleDarkMode);
function toggleDarkMode() {
  // 用toggle简化类名切换逻辑
  document.body.classList.toggle('dark-mode', toggleSwitch.checked);
}

video.addEventListener('timeupdate', function() {
  const currentTime = video.currentTime;
  const now = new Date();
  const hours = now.getHours();
  const minutes = now.getMinutes();

  // 修正数字写法，添加触发标记，放宽时间判断条件
  if (hours === 8 && minutes === 15 && currentTime >= 495 && !hasTriggeredPause) {
    hasTriggeredPause = true;
    video.pause();
    setTimeout(function() {
      video.play();
      // 恢复播放后重置标记，允许后续再次触发（若有需求）
      hasTriggeredPause = false;
    }, 60000);
  }
});

修复说明

• 修正数字写法，避免八进制解析的潜在问题
• 添加hasTriggeredPause标记，确保同一条件下只执行一次暂停和恢复流程
• 简化深色模式切换的代码逻辑，更简洁高效
• 放宽视频时间判断条件，只检查是否达到495秒，避免因事件触发时机错过而不执行

内容的提问来源于stack exchange，提问作者therandomspoon