jquery 事件绑定

event：统一事件模型
  "事件沿着对象树传播"这一图景是面向对象界面编程模型的精髓所在。对象的复合构成对界面结构的一个稳定的描述，事件不断在对象树的某个节点发生，并通过冒泡机制向上传播。对象树很自然的成为一个控制结构，我们可以在父节点上监听所有子节点上的事件，而不用明确与每一个子节点建立关联。
  jQuery除了为不同浏览器的事件模型建立了统一抽象之外,主要做了如下增强:
  A. 增加了自定制事件(custom)机制. 事件的传播机制与事件内容本身原则上是无关的, 因此自定制事件完全可以和浏览器内置事件通过同一条处理路径, 采用同样的监听方式. 使用自定制事件可以增强代码的内聚性, 减少代码耦合. 例如如果没有自定制事件, 关联代码往往需要直接操作相关的对象
Java代码 
$('.switch, .clapper').click(function() { 
    var $light = $(this).parent().find('.lightbulb'); 
    if ($light.hasClass('on')) { 
        $light.removeClass('on').addClass('off'); 
    } else { 
        $light.removeClass('off').addClass('on'); 
    } 
  }); 

而如果使用自定制事件,则表达的语义更加内敛明确,
Java代码 
$('.switch, .clapper').click(function() { 
  $(this).parent().find('.lightbulb').trigger('changeState'); 
}); 

  B. 增加了对动态创建节点的事件监听. bind函数只能将监听函数注册到已经存在的DOM节点上. 例如
Java代码 
$('li.trigger').bind('click',function(){}} 

  如果调用bind之后,新建了另一个li节点,则该节点的click事件不会被监听.
  jQuery的delegate机制可以将监听函数注册到父节点上, 子节点上触发的事件会根据selector被自动派发到相应的handlerFn上. 这样一来现在注册就可以监听未来创建的节点.
Java代码 
$('#myList').delegate('li.trigger', 'click', handlerFn); 

  最近jQuery1.7中统一了bind, live和delegate机制, 天下一统, 只有on/off.
Java代码 
$('li.trigger’).on('click', handlerFn);  // 相当于bind 
$('#myList’).on('click', 'li.trigger', handlerFn);  // 相当于delegate