jquery事件绑定

1、使用$(“#id”).bind(event,[data],function(eventObject))方法将监听器绑定到目标元素上
//type:附加到元素的一个或多个事件。由空格分隔多个事件。必须是有效的事件。如click、change、mouseover等
//data:传入监听函数的参数，通过event.data取到。可选参数。
//function：监听函数，可传入jQuery封装的event对象，与原生的event对象有区别。
可以使用类似”ele.click(function(){});“的简化方式。
对于页面上动态添加的元素使用bind方法会有一些问题。看下面的示例代码，列表中动态增加一个“列表元素5”，点击它是没有反应的，必须再bind一次才行。

$('#myol li').bind('click',getHtml);

2、$(“#id”).live(event, [data], function)
//event:附加到元素的一个或多个事件。由空格分隔多个事件。必须是有效的事件。
//data:可选。传递到函数的额外数据。
//function:必需。事件发生时运行的函数。
live方法将监听器绑定到目标元素的context上，context为限定范围，通常就是document。这样将节点的事件处理委托给了document。在监听函数中，可以用event.currentTarget来获取到当前捕捉到事件的节点。

3、$(“#id”).delegate(childSelector,event,data,function)
//childSelector:必需。附加事件处理程序的一个或多个子元素。
//event:必需。附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。
//data:可选。规定传递到函数的额外数据。
//function:必需。事件发生时运行的函数。
live方式的缺点是，大量元素将监听器绑定到document上，document负担繁重。使用delegate方式可以较好解决这个问题，将监听器绑定到就近的父级元素上不就可以啦。
bind方法、live方法和delegate方法的内部都调用的是on方法。下面看看重要的on方法。

4、$(“#id”).on( events [, selector ] [, data ], handler(eventObject) )
event：必需。一个或多个空格分隔的事件类型和可选的命名空间，或仅仅是命名空间。由空格分隔多个事件值。必须是有效的事件。
childSelector:可选。一个选择器字符串，用于过滤出被选中的元素中能触发事件的后代元素。如果选择器是null或者忽略了该选择器，那么被选中的元素总是能触发事件。
data:可选。传递到函数的额外数据。
function:必须。事件发生时运行的函数。

官方推荐使用on方法，因为其他三种方法内部都是调用on方法实现的，直接调用on方法可以提高效率。on()方法还有一个优点，就是可以绑定动态添加到页面元素的事件。