Jquery绑定事件方式比较案例

 jquery 绑定事件方式比较

静态绑定：只适用于当前元素，不适应未来的元素（比如由脚本创建的新元素）；
动态绑定：适用于当前及未来的元素。


1、在dom元素中直接绑定
该方法支持动态绑定。例如：。
2、$(selector).click(function(){})
此种方式只能绑定静态元素，不支持动态绑定元素。即页面上元素有新添加的元素，绑定事件对新添加的原始不起作用；

3、$(selector).on(event,childselector,data,function)
自 jquery 版本 1.7 起，on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。该方法给 api 带来很多便利，我们推荐使用该方法，它简化了 jquery 代码库。使用on()方法在被选元素及子元素上添加一个或多个事件处理程序。

on()方法的两种使用方式：
$(selector).on('click','li',function(){})：支持动态绑定元素（适用于当前及未来的元素，比如由脚本创建的新元素），前提是selector须是目标绑定元素的父元素。
$(selector).on('click',function(){})：直接绑定动态的li元素将不支持动态绑定，效果与$('').click()相同。

提示：如需移除事件处理程序，请使用 off() 方法。
如需添加只运行一次的事件然后移除，请使用 one() 方法。