javascript - 我怎么知道 removeEventListener 成功了？

Question

有没有办法确认 removeEventListener 是否成功？我在“播放”/“暂停”事件的视频元素上使用它。我试图实现的行为似乎不一致。这是我如何使用它的示例。

var playListener = function(){
  console.log("video is playing") 
}

videoElement.addEventListener("playing", playListener)

我代码中的其他地方

videoElement.removeEventListener("playing", playListener)

playListener 在我使用 removeEventListener 的地方可用，我正在传递视频元素的 id，因此它与我的 videoElement 相同添加了事件监听器。

我想知道我是否可以做一些 console.log 或其他事情来确认 removeEventListener 有效。

Answer 1

遗憾的是，removeEventListener 方法在未成功移除事件监听器时不会返回任何内容或抛出错误。也没有 JavaScript 方法来访问当前为给定元素设置的事件监听器。

就调试您的问题而言，大多数现代浏览器的开发人员工具确实提供了查看事件监听器的功能。您可以在代码中放置一个 debugger 语句(或设置断点)以在调用 removeEventListener 之前立即暂停执行:

debugger;
videoElement.removeEventListener("playing", playListener);

一旦到达断点并暂停执行，请从 Chrome 开发工具的“元素”选项卡中检查事件监听器，以验证您的事件监听器当前已设置:

您还可以在 Firefox 开发工具的检查器选项卡中找到事件监听器:

验证您的事件监听器当前已设置后，返回到调试器(Chrome“源代码”选项卡/Firefox“调试器”选项卡)并单步执行代码(F10) 逐行。

调用 removeEventListener 后，返回并再次检查您的事件监听器。如果成功，则不应再设置事件监听器。完成调试后，您可以继续执行代码 (F8)。