复制操作代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>文档处理_复制操作</title>
<script type="text/javascript" src="js/jquery-1.11.0.min.js" ></script>
<script>
/**
* 需求
* 1.单击苹果、橘子或者菠萝列表项,复制点击的内容并追加到ul的末尾
* 2.单击苹果、橘子或者菠萝列表项,复制点击的内容并追加到ul的末尾,要求复制后的内容也具有复制的能力
*/ /**
* 方法分析:
* 1.clone():克隆匹配的DOM元素并且选中这些克隆的副本。
* 2.clone():元素以及其所有的事件处理并且选中这些克隆的副本
*/ $(function(){
//点击li列表项,将当选点击的li内容追加到ul末尾
$("ul li").click(function(){
//$(this).clone().appendTo("ul"); // 复制当前点击的节点,并将它追加到<ul>元素
$(this).clone(true).appendTo("ul");//设置参数true后,复制后的内容也具备单击事件
})
});
</script>
</head>
<body>
<p title="选择你最喜欢的水果." >你最喜欢的水果是?</p>
<ul>
<li title='苹果'>苹果</li>
<li title='橘子'>橘子</li>
<li title='菠萝'>菠萝</li>
</ul>
</body>
</html>

运行结果:

多次点击li之后:

注意:clone()里面参数是否为true影响着复制出来的东西是否具有和原来一样的属性,也就是说如果为true你点击了橘子,生成了一个橘子,但是你点击新生成的橘子,也会复制;相反里面没有参数,则点击新生成的则不具有复制的功能。

jQuery_复制操作的更多相关文章

  1. 【转】批量复制操作(SqlBulkCopy)的出错处理:事务提交、回滚

    原文地址:http://blog.csdn.net/westsource/article/details/6658109 默认情况下,批量复制操作作为独立的操作执行. 批量复制操作以非事务性方式发生, ...

  2. 让 select 的 option 标签支持事件监听(如复制操作)

    这标题,让option支持事件监听,应该不难的呀,有什么好讲的? 其实还是有的,默认在浏览器代码是无法直接对option标签进行操作的,不仅包括JS事件监听,还是CSS样式设置 查了一些资料,姑且认为 ...

  3. [转]Windows系统中监控文件复制操作的几种方式

    1. ICopyHook 作用: 监视文件夹和打印机移动,删除, 重命名, 复制操作. 可以得到源和目标文件名. 可以控制拒绝操作. 缺点: 不能对文件进行控制. 只对Shell文件操作有效, 对原生 ...

  4. Windows系统中监控文件复制操作的几种方式

    http://blog.sina.com.cn/s/blog_4596beaa0100lp4y.html 1. ICopyHook 作用: 监视文件夹和打印机移动,删除, 重命名, 复制操作. 可以得 ...

  5. 机器学习进阶-图像基本操作-边界补全操作 1.cv2.copyMakeBoder(img, top_size, bottom_size, left_size, right_size, cv2.BORDER_REPLICATE) 进行边界的补零操作 2.cv2.BORDER_REPLICATE(边界补零复制操作)...

    1.cv2.copyMakeBoder(img, top_size, bottom_size, left_size, right_size, cv2.BORDER_REPLICATE) 参数说明: i ...

  6. Java学习笔记——File类文件管理及IO读写、复制操作

    File类的总结: 1.文件和文件夹的创建 2.文件的读取 3.文件的写入 4.文件的复制(字符流.字节流.处理流) 5.以图片地址下载图片 文件和文件夹 相关函数  (boolean) mkdir( ...

  7. mysql主从服务器复制操作

    master主机ip:192.168.1.19  用户名sunzy 密码123456slave主机ip:192.168.1.20 1.配置master1)接下来对master进行配置,包括打开二进制日 ...

  8. vim 粘贴复制操作

    原文链接:http://www.cnblogs.com/lansh/archive/2010/08/19/1803378.html vi编辑器有3种模式:命令模式.输入模式.末行模式.掌握这三种模式十 ...

  9. SqlServer 2014该日志未截断,因为其开始处的记录是挂起的复制操作或变更数据捕获

    环境:AlwaysOn集群 操作系统:Windows Server 2008 R2 数据库: SQL Server 2014 错误提示:“该日志未截断,因为其开始处的记录是挂起的复制操作或变更数据捕获 ...

随机推荐

  1. thinkphp框架部署出现404解决

    1:虚拟机配置文件修改: location / { index index.php index.html; if (!-e $request_filename) { rewrite ^/index.p ...

  2. oa_mvc_easyui_删除(6)

    1.删除列,添加a标签,绑定参数 <a href="javascript:void(0)" class="delete" ids="@newli ...

  3. 笔记本电脑重装win7/win10系统教程

    由于笔记本第一次重装系统会出现系统装不上,还有出现找不到有效硬盘分区,等等问题,然后这篇文章主要讲解BIOS设置的方法,用此BIOS设置,电脑用原本安装系统的方式,能有效地解决以上问题,这有两种方法解 ...

  4. Arduino控制LED灯(开关控制)

    问题:当使用"digitalRead(BUT) == 1"控制LED灯时会出现"digitalWrite(LED, ledState);"的值出现跳动. 原因: ...

  5. 【Lucene】小谈lucene的BooleanQuery查询对象

    BooleanQuery用于逻辑查询,即所谓的组合查询,具体的逻辑关系如下: 一个具体的使用测试,如下:

  6. weex 轮播如何使用?

    下面的内容是你必须要掌握的 1.怎么让banner的宽度和屏幕的宽度相等 2.怎么让banner自动轮播和轮播间隔 3.如何添加指示器 4.如何设置指示器的颜色和大小 5.点击轮播图时触发事件 6.检 ...

  7. 关于页面多个ajax请求阻塞的问题

    最近遇到一个问题,我的一个页面有多个ajax请求,但是一个很快的请求却需要很长时间才返回,而且慢于一个耗时比较长的请求,我在考虑是不是有ajax异步并发有问题,但是查询了一些资料,ajax不存在这样的 ...

  8. poj 1163 The Triangle(dp)

    The Triangle Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 43993   Accepted: 26553 De ...

  9. 自学Python-基于tcp协议的socket

    自学Python之路-Python基础+模块+面向对象自学Python之路-Python网络编程自学Python之路-Python并发编程+数据库+前端自学Python之路-django 自学Pyth ...

  10. 010-SaltStack及SaltStack Web UI安装部署

    saltstack web uiweb平台界面 saltapi项目主页:http://salt-api.readthedocs.org/en/latest/ halite 项目主页:https://g ...