页面加载时若视频同时触发两个事件监听，如何停止第一个事件的运行？

你可以通过以下两种方式满足需求：

方案1：共享状态标识位（通用可恢复） #

通过一个闭包/全局变量记录play事件是否已触发，suspend事件执行前先校验该状态，适合后续还需要恢复suspend执行能力的场景：

// 初始化控制变量，false代表play事件还未触发
let hasPlayFired = false

obj.addEventListener('suspend', () => {
  // 仅play未触发时才执行suspend逻辑
  if (!hasPlayFired) {
    // 你的suspend业务代码
  }
});

obj.addEventListener('play', () => {
  // 先标记play已触发，阻断suspend逻辑
  hasPlayFired = true
  // 你的play业务代码
});

如果存在suspend比play先触发的极端场景，可以给suspend逻辑加0ms延迟，确保状态判断时play的标记逻辑已经执行：

let hasPlayFired = false

obj.addEventListener('suspend', () => {
  setTimeout(() => {
    if (!hasPlayFired) {
      // 你的suspend业务代码
    }
  }, 0)
});

obj.addEventListener('play', () => {
  hasPlayFired = true
  // 你的play业务代码
});

方案2：动态移除suspend监听器（性能更优） #

如果play触发后再也不需要执行suspend逻辑，可以直接移除suspend的事件监听器，注意需要把suspend的回调定义为具名函数才能正常移除：

// 定义具名的suspend回调
function suspendHandle() {
  // 你的suspend业务代码
}

obj.addEventListener('suspend', suspendHandle);

obj.addEventListener('play', () => {
  // 移除suspend监听器，后续不会再触发该事件逻辑
  obj.removeEventListener('suspend', suspendHandle)
  // 你的play业务代码
});

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