javascript - JQuery一个对象可以同时绑定多个事件，这是如何实现的？

Question

如题，主要是想问bind on delegate live进行多事件绑定的原理

Answer 1

$ele.on('eventName', handle1);
$ele.on('eventName', handle2);
$ele.on('eventName', handle3);

其实$ele元素的eventName事件有一个处理函数数组 监听一次就往里面放一个handle， 数组是先进后出型的
也就是栈， 然后触发事件的时候一次执行

上面的监听相当于

$ele.eventHandle['eventName'] = [];
$ele.eventHandle['eventName'].push(handle1);
$ele.eventHandle['eventName'].push(handle2);
$ele.eventHandle['eventName'].push(handle3);

然后$ele.trigger('eventName')触发的时候， 从栈里面取出处理函数执行

while($ele.eventHandle['eventName'].length) {
    handle = $ele.eventHandle['eventName'].pop();
    handle();
}

最先监听的最后执行

我猜应该是这样

Answer 2

我不知道jQuery是如何实现的。但原生的js通过addEventListener()，attachEvent()（IE）也可以绑定多个事件。

Answer 3

bind() 方法为被选元素添加一个或多个事件处理程序，并规定事件发生时运行的函数。
on() 方法事件处理程序到当前选定的jQuery对象中的元素。
delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。
live() 方法为被选元素附加一个或多个事件处理程序，并规定当这些事件发生时运行的函数