once 是 addeventlistener 的布尔型配置项,设为 true 时监听器仅执行一次后自动移除;适用于初始化、防重复提交、动画回调等场景,不支持 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 或降级处理










