使用once参数让addEventListener只触发一次回调

`once` 是 `addEventListener` 中一个简洁而强大的布尔配置项，设置为 `true` 后能让事件监听器在首次触发后自动移除，彻底告别手动调用 `removeEventListener` 的繁琐与引用管理难题；它特别适合初始化加载、防重复提交、动画结束回调和一次性用户引导等场景，大幅提升代码可读性与健壮性——不过要注意它不兼容 IE，现代项目中合理使用能让你的事件处理既优雅又高效。

在 JavaScript 中，addEventListener 的 once 选项可以让事件监听器在首次触发后自动移除，无需手动调用 removeEventListener。

什么是 once 参数

once 是一个布尔类型的配置项，属于 addEventListener 的第三个参数（即 options 对象）。设为 true 时，该监听器只执行一次，之后自动失效。

基本用法示例

以下代码点击按钮后只弹出一次提示：

const btn = document.getElementById('myButton');
btn.addEventListener('click', () => {
  alert('只触发一次！');
}, { once: true });

常见适用场景

• 初始化操作：比如页面加载完成后执行一次资源预加载或状态检查
• 防重复提交：表单提交按钮点击后禁用并监听一次 submit 事件
• 动画或过渡完成回调：监听 transitionend 或 animationend 时避免多次触发
• 一次性用户引导：首次进入页面展示 tooltip 后自动解绑

注意事项

• 不能与 removeEventListener 混用：因为监听器已自动清理，再调用 removeEventListener 无效
• 匿名函数可直接使用：不像传统方式需要保存函数引用才能移除，once 让代码更简洁
• 与其他选项可共存：比如同时设置 { once: true, capture: true }
• 不支持 IE 浏览器：IE 完全不支持 once，需用 polyfill 或降级处理

今天关于《使用once参数让addEventListener只触发一次回调》的内容介绍就到此结束，如果有什么疑问或者建议，可以在golang学习网公众号下多多回复交流；文中若有不正之处，也希望回复留言以告知！