为了对比这几种方法，我简单做了个例子html代码如下：<p>我啦啦啦啦啦啦啦</p><p>我啦啦啦啦啦啦啦</p><p>我啦啦啦啦啦啦啦</p><p>我啦啦啦啦啦啦啦</p><button id="m
为了对比这几种方法，我简单做了个例子html代码如下：
<p>我啦啦啦啦啦啦啦</p><p>我啦啦啦啦啦啦啦</p><p>我啦啦啦啦啦啦啦</p><p>我啦啦啦啦啦啦啦</p><button id="mybtn">button</button>js代码如下：
$("#mybtn").click(function(event){ $("<p>wolalalallalalalala</p>").insertAfter("#mybtn");});这段js代码的意思是点击按钮，会生成一个新的p元素，用来比较绑定事件的方法对动态生成的元素是否有效。
一：直接添加事件
$("p").click(function(event){ $(this).slideToggle();});这种方法简单粗暴，也就是bind()的一种简单方法,因此没给点击button生成的p元素添加到事件。
二:bind()
$("p").bind("click",function(event){ $(this).slideToggle();}); //未来生成的元素无效，这个例子点击button后生成的p元素没绑定到事件；上面已经泄露了bind方法的一个特点，就是不能为动态生成的元素添加事件。除了这个特点外，bind还有个弊端，就是当要给多个元素（元素集合）绑定事件时，因为相当于给每个事件都分别添加事件，所以效率很低。这种情况用on和delegate会更好。
三：on()
$(document).on("click","p",function(event){ $(this).slideToggle();}) //也可以为未来创建的元素绑定事件，这个例子中即点击button后添加的p元素也添加了这个事件；on方法除了可以把事件委托到document，也可以委托到目标元素的父元素；像这个例子一样，需要为所有的p（包括点击按钮生成的p）添加元素的时候，把事件委托到document，然后在on方法的第二个参数上添加选择器，这样就相当于一次为多个元素绑定了事件，效率很快。同时，假如只为一个元素添加事件，on方法也可以像bind方法那样高效，就像下面这样
$(#id).on(event,function);四：delegate()
$(document).delegate("p","click",function(event){ $(this).slideToggle();}); //也可以为未来创建的元素绑定事件，这个例子中即点击button后添加的p元素也添加了这个事件；delegate方法除了可以把事件委托到document，也可以委托到目标元素的父元素，与on方法的主要区别是参数的顺序刚好相反。
五：one()这个比较特殊，用one绑定的事件只能执行一次，执行之后就会自动接触事件绑定；代码如下：
$("p").one("click",function(){ $(this).animate({fontSize:"+=6px"});});总结：尽量使用on()。。。。
