JavaScript中可通过addEventListener的{once: true}选项实现一次性事件监听，触发后自动移除，无需手动调用removeEventListener，兼容现代浏览器且适用于所有标准DOM事件。
JavaScript 中可以通过 addEventListener 的第三个参数（选项对象）设置 once: true，让事件监听器在触发一次后自动移除。
使用 once 选项注册一次性事件
这是最简洁、原生支持的方式。只需在调用 addEventListener 时传入配置对象 { once: true }：
- 事件触发后，监听器自动被移除，无需手动调用
removeEventListener - 兼容现代浏览器（Chrome 55+、Firefox 50+、Safari 10+、Edge 79+）
- 适用于所有标准 DOM 事件（如
click、load、submit等）
示例：
button.addEventListener('click', function handler() {
console.log('只执行一次');
}, { once: true });
注意：无法通过 removeEventListener 手动移除
带 once: true 的监听器是“一次性绑定”，内部机制决定了它不会保留在事件监听队列中供后续移除。即使你保留了函数引用：
deep-java-review
下载
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
立即学习“Java免费学习笔记（深入）”；
- 调用
removeEventListener('click', handler, { once: true })不会生效——因为该组合并未被当作已注册监听器存储 - 正确的移除方式是不加
once，改用显式管理（适合需要中途取消的场景）
替代方案：手动移除（需保存函数引用）
如果需要更灵活的控制（比如可能提前取消），可不使用 once，而是在回调内首次执行后主动移除：
function handler() {
console.log('执行并解绑');
button.removeEventListener('click', handler);
}
button.addEventListener('click', handler);
这种方式兼容性更好，也便于调试和条件解绑。
常见适用场景
- 页面加载完成后的初始化操作（配合
window.addEventListener('load', ..., { once: true })） - 表单提交后禁用按钮，防止重复提交
- 动画或过渡结束回调（如
transitionend） - 资源加载成功/失败后的一次性处理（如
img.addEventListener('load', ..., { once: true })）
