jQuery动态生成的元素如何绑定事件

 这段时间在写代码的时候遇到一个问题，通过append()添加的节点，点击事件不起作用。当时我百思不得其解，各种找错都没找到错误的原因。后来才发现是动态生成节点的问题，还是自己没有经验啊。

  下面来总结一下这个问题的始末，温故而知新。

 先看下click绑定事件的效果。

	<div>
		<p>a</p>
		<p>b</p>
		<p>c</p>
	</div>

 创建一个按钮来生成新的节点p

	<button>create</button>

 绑定点击事件

	<script>
		//添加点击事件
		$("p").click(function(){
			$(this).text('click');
		})
		
		//创建一个新节点
		$("button").click(function(){
			var p ="<p>new</p>";
			$("div").append(p);
		})
	</script>

 点击第一p元素，事件生效，运行结果：

 点击按钮，生成新的节点，并点击新的节点，运行结果：

 结果证明，click并没有绑定到新的节点上。

 如果需要给动态的元素绑定事件，需要使用到on()。

	$("div").on("click","p",function(){
		$(this).text('click');
	})

 on()方法，可以给未来的元素绑定事件

 使用方法：
  1、先选中动态生成元素的父元素
  2、然后绑定事件
  3、再选中子类

 可以理解为给div下的p元素包括未来的p元素绑定click事件,这是比较通俗易懂的理解，详细内容可以看文档的具体说明