JQuery使用on绑定动态生成元素时碰到的问题

今天在写界面时，希望对一些由JS代码动态添加的html标签进行事件绑定，使用了jquery 1.6+才提供的on函数。我的JQ版本是1.9.2。

以下这段代码是动态生成的。

<div class="container">
<!--动态生成部分-->
<p>
…………
</p>
</div>

我对<p>标签绑定了on函数，但是实际使用时却无法触发事件。

查看了官方文档，发现on有四个可选参数，分别是：events,[selector],[data],fn。每个参数的功能如下：

events:一个或多个用空格分隔的事件类型和可选的命名空间，如"click"或"keydown.myPlugin" 。

selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代。如果选择的< null或省略，当它到达选定的元素，事件总是触发。

data:当一个事件被触发时要传递event.data给事件处理函数。

fn:该事件被触发时执行的函数。 false 值也可以做一个函数的简写，返回false。

于是查阅了相关资料之后，发现selector这个函数用处非常大。

$("p").on('click', function(){

//…………

});

之前我是这样写的函数：

如果你的元素是动态添加的，那么你需要首先绑定一个静态的父元素，然后再使用selector来选择动态添加的元素。

代码修改如下：

$("。container").on('click', 'p',  function(){

//…………

});

至此，运行无误。

参考资料：http://mini.kisexu.com/post/2013-08-07/40053424637