jQuery 1.9/2.0/2.1及其以上版本无法使用live函数了，然而jQuery 1.9及其以上版本提供了on函数来代替。本文讲解了jQuery on函数的使用方法，以及在使用jQuery函数中遇到的一些问题。

jQuery on函数语法

1	$(selector).on(event,childSelector,data,function,map)

各个参数说明如下：

 

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

按照上面的语法下面的例子是可以实现的

12345678910111213141516171819

Click this paragraph.

但是如果要绑定的on方法是动态加载出来的元素，那么这样使用就是没有用的。看下面的例子：

123456789101112131415161718192021222324252627282930313233

This example demonstrates how to achieve the same effect using on() and bind().   This is some text. Click to set background color using the on() method.   This is some text. Click to set background color using the bind() method.

上面例子中.test元素是动态加载的，但是给它绑定click方法的时候，明明使用了

1	$(".test").css("background-color","pink");

将背景色设为pink，但是没有起作用，什么原因呢，原因就在于.test是动态加载的元素，而使用上面的方法不能绑定动态加载元素的事件，修正的方法为使用下面的代码代替：

123456789101112131415161718192021222324252627282930313233

This example demonstrates how to achieve the same effect using on() and bind().   This is some text. Click to set background color using the on() method.   This is some text. Click to set background color using the bind() method.

究其元素就在于使用$(document)意义就在于使元素加载完后才执行方法，所以当为jQuery动态加载的元素绑定on方法的时候，使用$(document)设置代码脚本在DOM元素加载完成后开始执行。