jQuery的事件委托方法bind、live、delegate,on之间的区别

jQuery中提供了四种事件监听方式，分别是bind、live、delegate、on，对应的解除监听的函数分别是unbind、die、undelegate、off。

1，bind

bind()向匹配元素添加一个或多个事件处理器。

$(selector).bind(event,data,function)

bind是使用频率较高的一种，作用就是在选择到的元素上绑定特定事件类型的监听函数，参数的含义如下：
event:事件类型，如click、change、mouseover等;
data:传入监听函数的参数，通过event.data取到。可选;
function:监听函数，可传入event对象，这里的event是jQuery封装的event对象，与原生的event对象有区别，使用时需要注意。

bind的特点就是会把监听器绑定到目标元素上，有一个绑一个，在页面上的元素不会动态添加的时候使用它没什么问题。

解除绑定时只需要调用unbind方法即可

$(selector).unbind(event);

注意：绑定和解绑传入的对象和事件类型一定要一致。

优点：
这个方法提供了一种在各种浏览器之间对事件处理的兼容性解决方案
非常方便简单的绑定事件到元素上
.click(), .hover()...这些非常方便的事件绑定，都是bind的一种简化处理方式
对于利用ID选出来的元素是非常好的，不仅仅是很快的可以hook上去(因为一个页面只有一个id),而且当事件发生时，handler可以立即被执行(相对于后面的live, delegate)实现方式

缺点：
它会绑定事件到所有的选出来的元素上
它不会绑定到在它执行完后动态添加的那些元素上
当元素很多时，会出现效率问题
当页面加载完的时候，你才可以进行bind()，所以可能产生效率问题

2，live

live() 向当前或未来的匹配元素添加一个或多个事件处理器；

$(selector).live(event,data,function);

event:事件类型，如click、change、mouseover等;
data:可选；需要传递的参数
function:监听函数，可传入event对象，这里的event是jQuery封装的event对象

但live和bind的区别在于：

live方法并没有将监听器绑定到自己(this)身上，而是绑定到了this.context上了。live正是利用了事件委托机制来完成事件的监听处理，把节点的处理委托给了document。使用事件委托的优点一目了然，新添加的元素不必再绑定一次监听器。

另外：

live还可以多事件处理，如下：

$(selector).live({event1:function, event2:function, ...});

多个事件和函数之间用分号隔开，可给同意对象绑定多个事件。

解除绑定时只需要调用unbind方法即可

$(selector).die(event);

注意：绑定和解绑传入的对象和事件类型一定要一致。

优点：
这里仅有一次的事件绑定，绑定到document上而不像.bind()那样给所有的元素挨个绑定
那些动态添加的elemtns依然可以触发那些早先绑定的事件，因为事件真正的绑定是在document上
你可以在document ready之前就可以绑定那些需要的事件

缺点：
从1.7开始已经不被推荐了，所以你也要开始逐步淘汰它了。
Chaining没有被正确的支持
当使用event.stopPropagation()是没用的，因为都要到达document，因为所有的selector/event都被绑定到document, 所以当我们使用matchSelector方法来选出那个事件被调用时，会非常慢
当发生事件的元素在你的DOM树中很深的时候，会有performance问题

3，delegate

将监听事件绑定在就近的父级元素上

$(selector).delegate(childSelector,event,data,function);

childSelector: 必需项；需要添加事件处理程序的元素，一般为selector的子元素；
event：必需项；添加到元素的一个或多个事件，例如 click,dblclick等；

data:可选；需要传递的参数
function:监听函数，可传入event对象，这里的event是jQuery封装的event对象

同时delegate也支持多事件处理

$(selector).delegate(childselector,{event1:function, event2:function, ...});

多个事件和函数之间用分号隔开，可给同意对象绑定多个事件。

这样在绑定的饿时候可以选择最近的最稳定的元素绑定事件，可以更快的冒泡上去，提升效率。

解除绑定时只需要调用unbind方法即可

$(selector).undelegate(event);

注意：绑定和解绑传入的对象和事件类型一定要一致。

优点：
你可以选择你把这个事件放到那个元素上了
chaining被正确的支持了
jQuery仍然需要迭代查找所有的selector/event data来决定那个子元素来匹配，但是因为你可以决定放在那个根元素上，所以可以有效的减小你所要查找的元素。
可以用在动态添加的元素上


缺点：
需要查找那个那个元素上发生了那个事件了，尽管比document少很多了，不过，你还是得浪费时间来查找。

4，on

on() 为指定的元素,添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。使用 on() 方法的事件处理程序适用于当前或未来的元素。

$(selector).on(event,childselector,data,function);

event：必需项；添加到元素的一个或多个事件，例如 click,dblclick等；

childSelector: 可选；需要添加事件处理程序的元素，一般为selector的子元素；  
data：可选；需要传递的参数；
function：必需；当绑定事件发生时，需要执行的函数；

同时，on也支持多个事件处理

$(selector).on({event1:function, event2:function, ...},childselector);

多个事件和函数之间用分号隔开，可给同意对象绑定多个事件。

解除绑定时只需要调用unbind方法即可

$(selector).off(event);

注意：绑定和解绑传入的对象和事件类型一定要一致。

优点：
提供了一种统一绑定事件的方法
仍然提供了.delegate()的优点，当然如果需要你也可以直接用.bind()

缺点：
也许会对你产生一些困扰，因为它隐藏了一前面我们所介绍的三种方法的细节。

关于这四种事件委托方法还有还可能存在一些版本上的不兼容等问题，或者一些其他的差别，之后我会继续补充完善。