jQuery中绑定事件时bind和on的区别

jquery的bind跟on绑定事件的区别：主要是事件冒泡；
jquery文档中bind和on函数绑定事件的用法：

.bind(events [,eventData], handler)

.on(events [,selector]  [,data], handler)

.on方法比.bind方法多一个参数selector，.on的selector参数是筛选出调用.on方法的dom元素的指定子元素，由于JavaScript的事件冒泡特性，如果我们在父元素上注册了一个事件处理函数，当子元素上发生这个事件的时候，父元素上的事件处理函数也会被触发。如果使用on的时候，不设置selector，那么on与bind就没有区别了。
请看如下代码：

 <ul>
        <li id="li1">1</li>
        <li id="li2">2</li>
</ul>

当没有selector时使用.bind和.on：

 $('ul').bind('click', function () {    // 等同于$('ul').on('click', function () {
        console.log($(this).text());
});

那么结果为：

当有selector时，

 $('ul').on('click','#li1', function () {   
        console.log($(this).text());
});

点击1显示1，点击2就没有反应了
还有一点，on绑定的事件处理函数，对于未来新增的元素一样可以，但是bind就不行，看下面的代码：

 $('ul').on('click','li', function () {   
        console.log($(this).text());
});
$('ul').append('<li>3<li>')；

此时，点击3可以显示出3；

 $('ul li').bind('click', function () {   
        console.log($(this).text());
});
$('ul').append('<li>3<li>')；

此时，点击3就显示不出来了