在早版的jQuery中事件绑定有四种方法：bind、live、delegate、on。
其中live方法在jQuery 1.7之后不再建议使用，而是用on来代替。bind和delegate方法在jQuery 3.0之后不再建议使用，而是用on来代替。
1、先说on方法：on(events, [selector], [data], fn) 在元素上绑定一个或者多个事件的事件处理函数。
events：一个或多个用空格分隔的事件类型和可选的命名空间。
selector：一个选择器字符串用于过滤器的触发事件的选择器元素的后代。
data：当一个事件被触发时要传递event.data给事件处理函数。
fn：该事件被触发时执行的函数。
给事件传递参数
1 function myHandler(event) {
2 alert(event.data.foo);
3 }
4 $("p").on("click", {foo: "bar"}, myHandler)
off方法用于移除用on绑定的事件处理程序。off(events, [selector], [fn])
2、delegate方法：delegate(selector, [type], [data], fn)
selector：一个选择器字符串用于过滤触发事件的元素。
type：附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。
data：当一个事件被触发时要传递event.data给事件处理函数。
fn：该事件被触发时执行的函数。
例：当点击鼠标时，隐藏或显示p元素
1 <div style="background-color:red">
2 <p>这是一个段落。</p>
3 <button>请点击这里</button>
4 </div>
5
6 $("div").delegate("button","click",function(){
7 $("p").slideToggle();
8 });
3、bind方法：bind(type, [data], fn) 为每个匹配元素的特定事件绑定事件处理函数。
type：包含一个或多个事件类型的字符串，由空格分隔多个事件。
data：作为event.data属性值传递给事件对象的额外数据对象
fn：绑定到每个匹配元素上的事件处理函数
例：同时绑定多个事件
1 $('#foo').bind('mouseenter mouseleave', function() {
2 $(this).toggleClass('entered');
3 });
同时绑定多个事件处理函数：
1 $("button").bind({
2 click:function(){$("p").slideToggle();},
3 mouseover:function(){$("body").css("background-color","red");},
4 mouseout:function(){$("body").css("background-color","#FFFFFF");}
5 });
4、live方法，live(type, [data], fn)
live() 方法能对一个还没有添加进DOM的元素有效，是由于使用了事件委托：绑定在祖先元素上的事件处理函数可以对在后代上触发的事件作出回应。传递给 .live() 的事件处理函数不会绑定在元素上，而是把他作为一个特殊的事件处理函数，绑定在 DOM 树的根节点上。
其中，delegate方法、on方法添加的事件，动态生成的元素也会有这个事件，而bind方法绑定的事件，动态生成的元素不会有这个事件。
所以，如果有动态生成的元素时，绑定的事件时最好用on方法。
