首页
前端开发
Javascript
JavaScript自定义事件绑定函数

JavaScript自定义事件绑定函数

0 次浏览 0 条评论
js
js

封装的事件绑定函数，参数挺多，配置项也灵活，适合想偷懒又想掌控细节的你。常规的addEventListener够用是够用，但要做点封装，总得来点不一样的吧？这个函数可以让你按需加事件，还能传额外参数，配合你的业务逻辑挺顺手的。

函数里做了些细节，比如事件类型支持数组格式，一次绑一堆；还能传上下文，像在 Vue 组件里用就挺方便。更妙的是，支持自动解绑，省得你手动清理。

比如你想绑定一个按钮点击事件，还想顺手记录个日志，参数配置一下就行了，不用手写一堆重复代码。事件委托也能配合使用，页面响应还挺快。

有空你也可以看看我参考过的一些文章，像JavaScript 函数封装包那篇，讲得也蛮清楚；还有日历事件添加，思路也能借鉴借鉴。

代码我就贴一小段示意，方便你看看格式：

function addEvent(el, type, handler, options = {}) {
  if (Array.isArray(type)) {
    type.forEach(t => addEvent(el, t, handler, options));
    return;
  }
  el.addEventListener(type, handler.bind(options.context || null), options.capture || false);
}

，这函数不是多高级，但在项目里能省你不少事。如果你也有类似需求，不妨试试看。有问题也欢迎来拍砖！

js 文件大小：630B