在很多时候，我们需要通过 AJAX 或者用户操作动态的增加或者去除列表项元素，那么在每一次改变的时候都需要重新给新增的元素绑定事件。 事件委托的其中一个优点就是动态绑定事件，可以为“未来元素”绑定好事件。

入口函数

  • JavaScript的入口函数要等到页面中所有资源（包括图片、文件）加载完成才开始执行。

  • jQuery的入口函数只会等待文档树加载完成就开始执行，并不会等待图片、文件的加载。

附注：JQ和JS中还有load方法，用于等待页面中资源完全加载，再执行相应代码。

事件委托

事件委托，通俗地来讲，就是把一个元素响应事件（click、keydown……）的函数委托到另一个元素。

一般来讲，会把一个或者一组元素的事件委托到它的父层或者更外层元素上，真正绑定事件的是外层元素， 当事件响应到需要绑定的元素上时，会通过事件冒泡机制从而触发它的外层元素的绑定事件上，然后在外层元素上去执行函数。

jquery中的 on()方法

  • 语法

1

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

自 jQuery 版本 1.7 起，on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。