JQ实现向动态元素添加事件

最新推荐文章于 2024-04-17 10:25:16 发布

Jimadc

最新推荐文章于 2024-04-17 10:25:16 发布

阅读量6.1k

点赞数

分类专栏：记录前端点滴文章标签： Jquery on()

本文链接：https://blog.csdn.net/weixin_42779969/article/details/90634640

版权

本文介绍了如何使用JQuery的on()方法为动态添加的元素绑定点击复制事件。在微信统计功能的开发中，由于页面元素动态生成，传统的bind方法无法生效。通过on()方法，可以成功实现对现有及未来元素的事件监听。on()的基本语法、参数解释和实际应用示例均进行了详细说明。

摘要由CSDN通过智能技术生成

最近做的工作需要添加微信统计，然后页面里是动态添加的模拟对话，需要给动态添加的元素添加点击复制事件。

第一就想到了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&

最低0.47元/天解锁文章

Jimadc

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
JQ实现向动态元素添加事件

最近做的工作需要添加微信统计，然后页面里是动态添加的模拟对话，需要给动态添加的元素添加点击复制事件。第一就想到了JQ的bind事件，可是经过测试发现，bind事件不能给动态添加的元素进行事件添加，不能放弃啊，继续探索，终于功夫不负有心人，发现on事件可以实现这个效果。废话不多说，上代码：<!DOCTYPE html><html> <head> ...
复制链接

扫一扫