1、on()方法在被选元素及子元素上添加一个或多个事件处理程序。

自jQuery版本1.7起，on()方法是bind()、live()和delegate()方法的新的替代品。该方法给API带来了很多便利，我们推荐使用该方法，它简化了jQuery代码库。

注意：使用on()方法添加的事件处理程序适用于当前及未来的元素（比如由脚本创建的新元素）。

提示：如需移除事件处理程序，请使用off()方法。

语法： $(selector).on(event,childSelecotr,data,function)

2、on()方法语法其实很简单，只是在 bind() 的基础上多了一个 子选择器 ，简化了我们使用 bind() 在选择子元素时的判断工作，使代码更加简洁清晰。

下面简单的记录一个例子：（bind和on的使用区别）

比如在一个大的dom节点里有两个小的节点，分别为class1和class2，如果用bind()实现：

var x = docuemnt.getElementByClassName("name")[0];
x.addEventLister("click",function(e) {
    var target = e.target;
    if (target.className === "class1") {
        dosomething();
    }else if (target.className === "class2") {
        doanother();
    } else {
        console.err("ss");
})

这仅仅是两个子节点，如果很多我们会写大量的判断，换成on()来实现：

$('.name').on("click",'.class1', function() {
    dosonmething();
}).on("click",'.class2', function() {
    doanother();
});

除了上面的用法区别外，对于那些js生成的dom节点，你bind绑定不了，因为dom只渲染一次，而on却可以，也就是说，对于那些还没有生成dom节点，on同样可以绑定事件。