最近做的工作需要添加微信统计，然后页面里是动态添加的模拟对话，需要给动态添加的元素添加点击复制事件。
第一就想到了JQ的bind事件，可是经过测试发现，bind事件不能给动态添加的元素进行事件添加，不能放弃啊，继续探索，终于功夫不负有心人，发现on事件可以实现这个效果。废话不多说，上代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ON事件</title>
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<div id="content"><button>按钮</button></div>
<a href="javascript:;" onclick="add()">添加新元素</a>
<script type="text/javascript">
var add = function(){
$("#content").append('<button>按钮</button>');
}
$("body").on('click','button',function(event){
alert("这是动态添加的事件");
});
</script>
</body>
</html>下面对on事件进行简单的说明:
概述：在选择元素上绑定一个或多个事件的事件处理函数。
on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。
使用 on() 方法添加的事件处理程序适用于当前及未来的元素（比如由脚本创建的新元素）。
语法：$(selector).on(events,childSelector,data,function)
events:一个或多个用空格分隔的事件类型和可选的命名空间，如"click"或"keydown.myPlugin" 。
selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代。如果选择的 null 或省略，当它到达选定的元素，事件总是触发。
data:当一个事件被触发时要传递event.data给事件处理函数。
fn:该事件被触发时执行的函数。 false 值也可以做一个函数的简写，返回false。
提示：如需移除事件处理程序，请使用 off()方法。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>off实例</title>
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
</script>
<script>
$(document).ready(function(){
$("p").on("click",function(){
$(this).css("background-color","pink");
});
$("button").click(function(){
$("p").off("click");
});
});
</script>
</head>
<body>
<p>点击这个段落修改它的背景颜色。</p>
<p>点击一下按钮再点击这个段落( click 事件被移除 )。</p>
<button>移除 click 事件句柄</button>
</body>
</html>
版权声明：本文为weixin_42779969原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接和本声明。