一、错误示例：
对于自己用脚本动态生成的元素，无法绑定事件。例如：
body下的代码：
<body>
<ul>
<li><span class="class1">11111</span></li>
<li><span class="class1">22222</span></li>
<li><span class="class1">33333</span></li>
</ul>
<script src="../static/js/jquery.min.js"></script>
<script>
aButton=$(‘li‘)
aButton.each(function(i){
aButton.eq(i).attr(‘tag‘,‘edit‘)
$(this).click(function(){
$(this).html(‘<a href="#" class="active">‘+i+‘</a>‘)
})
})
aA=$(‘a‘)
aA.each(function(i){
console.log(‘kkkk‘)
$(this).click(function(){
console.log(‘i‘)
})
})
</script>
</body>运行结果：
当span标签被点击的时候，变成a标签，然后再点击a标签，没有任何反应。
原因：结果当生成a标签之后，无论如何点击都没有效果，因为jquery只能绑定页面本身存在的元素。动态生成的元素不能被绑定。而click事件，其实是bind(‘click‘,...)的简化形式。
二、正确的方法：
<body>
<ul>
<li><span class="class1">11111</span></li>
<li><span class="class1">22222</span></li>
<li><span class="class1">33333</span></li>
</ul>
<script src="../static/js/jquery.min.js"></script>
<script>
aButton=$(‘li‘)
aButton.each(function(i){
aButton.eq(i).attr(‘tag‘,‘edit‘)
$(this).click(function(){
$(this).html(‘<a href="#" class="active">‘+i+‘</a>‘)
})
})
$(‘li‘).delegate(‘a[class=active]‘,‘click‘,function(){
console.log($(this).html())
})
</script>
</body>运行结果：
当span标签被点击的时候，变成a标签，然后再点击a标签，console里打印出它的html内容。
说明：
1）delegate方法，代理或者说是委托，实现原理是事件的冒泡，在指定的祖先元素中注册事件（delegate在特定元素上），元素事件触发，传播到这个元素然后进行筛选。可以在祖先元素中绑定事件，比如上面的li是祖先元素，而新生成的元素a都是li的子元素，所以动态生成的元素的事件就可以绑定了。
delegate官网介绍：Attach a handler to one or more events for all elements that match the selector,now or in the future, based on a specific set of root elements.
官网网址：http://api.jquery.com/delegate/
2）选择器，注意：
var a= $("input:[name^=‘a‘]");表示所有name以a开头的input。而上面示例a[class=active],表示选中所有class为active的a标签
本文出自 “select” 博客，谢绝转载！
原文：http://wangqiaomei.blog.51cto.com/5561182/1701183