jQuery中clone（复制）

最新推荐文章于 2021-06-24 09:03:48 发布

原创最新推荐文章于 2021-06-24 09:03:48 发布 · 276 阅读

0 ·

CC 4.0 BY-SA版权

个人专栏收录该内容

64 篇文章

订阅专栏

本文详细探讨了jQuery中clone方法的使用，特别是当传入true或false参数时，如何影响复制元素的事件绑定。通过实例演示，展示了按钮复制后点击事件的存在与否，帮助读者理解clone方法的工作原理。

，clone方法传入false或不传入值，则后插入的按钮没有点击事件；传入true，则复制元素的同时也复制元素中的的事件 !

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-3.3.1.js" ></script>
	</head>
	<body>
		<input type="button" value="按钮"/>
		<script>
			$("[type='button']").bind("click",function(){
				console.log("按钮");
			})
			
			$("[type='button']").after($("[type='button']").clone(true));
		</script>
	</body>
</html>

此时为true 就是复制一个按钮（现在有两个按钮），点击复制的那个按钮有事件的点击。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-3.3.1.js" ></script>
	</head>
	<body>
		<input type="button" value="按钮"/>
		<script>
			$("[type='button']").bind("click",function(){
				console.log("按钮");
			})
			
			$("[type='button']").after($("[type='button']").clone(false));//clone方法传入false或不传入值，则后插入的按钮没有点击事件
		</script>
	</body>
</html>

此时为false 就是复制一个按钮（现在有两个按钮），点击复制的那个按钮没有事件的点击。