jquery之clone()方法详解
clone()
函数用于克隆当前匹配元素集合的一个副本,并以jQuery对象的形式返回。你也可以简单地理解为:克隆当前jQuery对象。
你还可以指定是否复制这些匹配元素(甚至它们的子元素)的附加数据( data()函数 )和绑定事件。
该函数属于jQuery
对象(实例)。
语法
jQueryObject.clone( withDataAndEvents [, deepWithDataAndEvents ] )
参数
参数 | 描述 |
---|---|
withDataAndEvents | 可选/Boolean类型是否同时复制元素的附加数据和绑定事件,默认为false 。 |
deepWithDataAndEvents | 可选/Boolean类型是否同时复制元素的所有子元素的附加数据和绑定事件,默认值即为参数withDataAndEvents 的值。 |
第二个参数不设置就默认为第一个参数的值
clone()
主要用于克隆当前jQuery对象的一个副本。
jQuery 1.5 新增支持:clone()支持第二个参数deepWithDataAndEvents
。该参数指示是否同时复制被克隆元素的所有子元素的附加数据和绑定事件。
注意:
1、在jQuery 1.4之前,clone()
函数只额外复制元素的绑定事件,从1.4版本开始,才开始支持复制元素的附加数据。2、1.5.0版本时(只有1.5.0),参数
withDataAndEvents
的默认值被错误地设定为true
,从1.5.1开始,其默认值才被改回false
。
返回值
clone()
函数的返回值为jQuery类型,返回当前jQuery对象的一个克隆副本。
注意:出于性能原因考虑,clone()
函数不会复制某些表单元素的动态,例如用户在<textarea>输入的内容、用户在<select>中选择的选项。不过<input>元素的动态将会被复制,例如用户在text中输入的内容、用户对checkbox的选中状态。
示例&说明
clone()
函数用于克隆当前jQuery对象。请参考下面这段HTML代码为例:
<p id="n1"> <input id="n2" type="button" value="按钮1" /> <input id="n3" type="button" value="按钮2" /></p>
以下jQuery示例代码用于演示clone()
函数的具体用法:
// 当前jQuery版本:1.11.1 $(":button").click( function(){ document.writeln( this.value );} );var $n2 = $("#n2");$n2.data("myData", "附加数据"); //没有克隆附加数据和绑定事件var $clonedN2 = $n2.clone(); // 两个参数均默认为falsedocument.writeln( $clonedN2.data("myData") ); // undefined$clonedN2.trigger("click"); // (没有绑定的点击事件,无响应输出) //同时克隆附加数据和绑定事件var $clonedN2WithCopy = $n2.clone( true ); // 两个参数:true、true(第二个参数不设置,默认为第一个参数的值)document.writeln( $clonedN2WithCopy.data("myData") ); // 附加数据$clonedN2WithCopy.trigger("click"); // 按钮1
jquery之clone()方法详解的更多相关文章
- jQuery插件制作方法详解
jQuery插件制作方法详解 jquery插件给我的感觉清一色的清洁,简单.如Jtip,要使用它的功能,只需要在你的元素的class上加 上Jtip,并引入jtip.js及其样式即可以了. ...
- jQuery中 $.ajax()方法详解
$.ajax()方法详解 jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为Strin ...
- jQuery - Ajax ajax方法详解
$.ajax()方法详解 jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为Strin ...
- Clone()方法详解
一.克隆的原理与应用 clone在堆上分配内存,分配的内存和源对象(即调用clone方法的对象)相同,然后再使用原对象中对应的各个域,填充新对象的域, 填充完成之后,clone方法返回,一个新的相同的 ...
- jquery之 animate()方法详解
jQuery.animate() 函数详解 animate()函数用于执行一个基于css属性的自定义动画. 你可以为匹配的元素设置css样式,animate()函数将会执行一个从当前样式到指定的css ...
- 方法object面试题分析:7JAVA中Object的clone方法详解-克隆-深克隆
时间紧张,先记一笔,后续优化与完善. 每日一道理 翻开早已发黄的页张,试着寻找过去所留下的点点滴滴的足迹.多年前的好友似乎现在看来已变得陌生,匆忙之间,让这维持了多年的友谊变淡,找不出什么亲切 ...
- 转:Java中的Clone()方法详解
Java中对象的创建 clone顾名思义就是复制, 在Java语言中, clone方法被对象调用,所以会复制对象.所谓的复制对象,首先要分配一个和源对象同样大小的空间,在这个空间中创建一个新的对象.那 ...
- jQuery之$.ajax()方法详解及实例
1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如 ...
- jQuery ajax - ajax() 方法详解
一些代码通过jQuery来做ajax异步提交. //验证昵称是否存在 function checkNickNameIsExist(){ var nickName = jQuery("#nic ...
随机推荐
- css在IE和Firefox下的兼容性
1.div的垂直居中问题 vertical-align:middle,将行距增加到和整个div高度一样,加line-height:200px;然后插入文字就垂直居中了.缺点是要控制内容不要换行. 2. ...
- 初学android的第一个习作
首发:个人博客,更新&纠错&回复 项目源码在这里,因为github上传速度太差,传到了oschina的git托管上. 1.项目结构及技术点 主页面使用FragmentTabHost,5 ...
- c# 操作xml题目
download! 1.新建一个文本文件,命名为:projects.txt. 2.将后缀名改为projects.xml. 3.用记事本编辑该文件.使用utf-8编码.内容如下: <?xml v ...
- 161019、并发容器ConcurrentHashMap
java.util.concurrent.ConcurrentMap<K, V>一种是用读写锁实现Map的方法.此种方法看起来可以实现Map响应的功能,而且吞吐量也应该不错.但是通过前面对 ...
- Android内存溢出解决方案(OOM)
众所周知,每个Android应用程序在运行时都有一定的内存限制,限制大小一般为16MB或24MB(视平台而定).因此在开发应用时需要特别关注自身的内存使用量,而一般最耗内存量的资源,一般是图片.音频文 ...
- PHP高级架构技术年度大盘点
2015年1月的最后一个周末,上海的冬季虽不如北方的雪窖冰天,但腊月的寒风也足以让人猫 在家中不愿出门.可是,在华美达酒店的一个会议室中,却人声鼎沸.春意融融,第三期商派技术沙龙正在火热进行,本期沙龙 ...
- php变量内存完全释放
<?php echo memory_get_usage().PHP_EOL;$a = 1;$b = $a;$a = null;$b = null;unset($a);unset($b);echo ...
- 【转】Android WebView 播放视频总结
今天发现 WebView里播放优酷的视频点击播放按钮后没反应,于是看官方文档和搜索解决,下面是我在别人基础上做的补充: android webView 无法播放视频,无法暂停,继续播放视频问题,无 ...
- ZOJ 3868 - Earthstone: Easy Version
3868 - Earthstone: Easy Version Time Limit:2000MS Memory Limit:65536KB 64bit IO Format:%lld ...
- c# TCPclient
服务端 using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; ...