Jquery之绑定事件的三种方法(.bind .live .on .delegate )

live方法其实是bind方法的变种，其基本功能就同bind方法的功能是一样的，都是为一个元素绑定某个事件，但是bind方法只能给当前存在的元素绑定事件，对于事后采用JS等方式新生成的元素无效，而live方法则正好弥补了bind方法的这个缺陷，它可以对后生成的元素也可以绑定相应的事件。

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

亲自试一试


bind() 方法为被选元素添加一个或多个事件处理程序，并规定事件发生时运行的函数

bind()对于未来的元素无效，live()弥补这个缺点。

	描述
event	必需。规定添加到元素的一个或多个事件。 由空格分隔多个事件。必须是有效的事件。
data	可选。规定传递到函数的额外数据。
function	必需。规定当事件发生时运行的函数。

$(selector).bind({event:function, event:function, ...})   

亲自试一试

参数	描述
{event:function, event:function, ...}	必需。规定事件映射，其中包含一个或多个添加到元素的事件，以及当事件发生时运行的函数。

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

亲自试一试

live() 方法为被选元素附加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。

通过 live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素（比如由脚本创建的新元素）。

3.$(selector).on(event,childSelector,data,function,map)  
  
尝试一下 »

	描述
event	必需。规定要从被选元素移除的一个或多个事件或命名空间。 由空格分隔多个事件值。必须是有效的事件。
childSelector	可选。规定只能添加到指定的子元素上的事件处理程序（且不是选择器本身，比如已废弃的 delegate() 方法）。
data	可选。规定传递到函数的额外数据。
function	可选。规定当事件发生时运行的函数。
map	规定事件映射 ({event:function, event:function, ...})，包含要添加到元素的一个或多个事件，以及当事件发生时运行的函数。

从 bind() 改为 on()

如何使用 on() 来达到与 bind() 相同的效果。

Changing from delegate() to on()

如何使用 on() 来达到与 delegate() 相同的效果。

从 live() 改为 on()

如何使用 on() 来达到与 live() 相同的效果。

添加多个事件处理程序

如何向元素添加多个事件处理程序。

使用 map 参数添加多个事件处理程序

如何使用 map 参数向被选元素添加多个事件处理程序。

在元素上添加自定义事件

如何在元素上添加自定义命名空间事件。

向函数传递数据

如何向函数传递数据。

向未来的元素添加事件处理程序

演示 on() 方法也适用于尚未创建的元素。

移除事件处理程序

如何使用 off() 方法移除事件处理程序。

4.$(selector).delegate(childSelector,event,data,function)   亲自试一试

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

使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。