clone()与clone(true)同为克隆

clone()表示复制标签本身

clone(true)会将标签绑定的事件一起复制

来看案例:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<style>
.c1 {
background-color: red;
}
</style>
<body>
<input type="button" class="c1" value="点我复制"> <script>
var $bEle = $(".c1");
$bEle.on("click",function () {
$bEle.clone(true).insertAfter(this) //或者 $bEle.clone(this).insertAfter(this)
})
</script>
</body>
</html>

显示效果

这三个按钮都可以点击并实现复制以此往后插入。

如果JS部分代码该为这样:

<script>
var $bEle = $(".c1");
$bEle.on("click",function () {
$bEle.clone().insertAfter(this)
})
</script>

那么仅仅只有第一个按钮可以通过点击实现自我复制,后面克隆得到的其他按钮都没有复制事件

jQuery之克隆事件--clone()与clone(true)区别的更多相关文章

  1. [转]jQuery中clone和clone(true)的区别

    jquery中clone() 和 clone(true)的区别. jquery复制 DOM的时候,原来还可以连 dom上面绑定的事件一起复制. 原文: https://www.cnblogs.com/ ...

  2. jQuery中clone和clone(true)的区别

    今天要写的是clone和clone(true)的区别 两者长得很像呀,clone(true)比clone()  多了一个true.看下图白白的牙,笑起来就是这么灿烂.有了true就跟笑起来一样,有了笑 ...

  3. clone()与clone(true)的区别

    clone()方法用于复制一个元素,但是被复制出来的元素不具备复制的功能,如果希望被复制出来的元素也具备复制的功能,需要给clone()方法加上true这个参数,即clone(true). 例如: & ...

  4. jQuery的属性,事件及操作

    1.属性操作 1.1 基本属性操作 $("img").attr("src") 返回文档中所有图像的src属性值 $("img").attr( ...

  5. 前端之JQuery:JQuery扩展和事件

    jQuery之jQuery扩展和事件 一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[d ...

  6. jQuery学习笔记:整理一些常用的jQuery操作DOM事件

    1.attr() .removeAttr() .attr() 方法可以传入一个名值对的参数,也可以传入一个包含2个以上名值对的对象参数,例如: .attr('src','images/a.jpg'); ...

  7. 第一百七十一节,jQuery,高级事件,模拟操作,命名空间,事件委托,on、off 和 one

    jQuery,高级事件,模拟操作,命名空间,事件委托,on.off 和 one 学习要点: 1.模拟操作 2.命名空间 3.事件委托 4.on.off 和 one jQuery 不但封装了大量常用的事 ...

  8. jQuery 效果函数,jquery文档操作,jQuery属性操作方法,jQuerycss操作函数,jQuery参考手册-事件,jQuery选择器

    jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...

  9. ajax的status为201依然触发jquery的error事件的问题

    昨天在调试一个ajax的时候发现,即使status是201,仍然会触发jquery的error事件.statusText是"parseerror". 通过在stackoverflo ...

随机推荐

  1. Leetcode部分题目整理(Javascript)

    3.无重复字符的最长子串 /** * @param {string} s * @return {number} */ var lengthOfLongestSubstring = function(s ...

  2. hdu 2510

    Tiling_easy version Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) ...

  3. MIME协议(六) -- MIME实例分析

    MIME实例分析 了解MIME协议的基本组织结构后,下面用Outlook Express撰写出一封显示效果如图4所示的电子邮件,然后分析该邮件的源文件,以便读者更加深入地了解MIME协议. 1. 启动 ...

  4. MyBatis动态Sql 的使用

    Mapper.xml提示: 1:mapper包中新建一个文件:mybatis-3-mapper.dtd 2:在web app libraries/mybatis.jar/org.apache.ibat ...

  5. Python2.x 里解决中文编码的万能钥匙

    注意: Python2.x默认编码环境是ASCII,当和取回的数据编码格式不一致时,可能会造成乱码:我们可以指定保存内容的编码格式,一般情况下,我们可以在代码最上方添加 import sys relo ...

  6. Leetcode题目96.不同的二叉搜索树(动态规划-中等)

    题目描述: 给定一个整数 n,求以 1 ... n 为节点组成的二叉搜索树有多少种? 示例: 输入: 3 输出: 5 解释: 给定 n = 3, 一共有 5 种不同结构的二叉搜索树: 1 3 3 2 ...

  7. BUUCTF平台-web-边刷边记录-2

    1.one line tool <?php if (isset($_SERVER['HTTP_X_FORWARDED_FOR'])) { $_SERVER['REMOTE_ADDR'] = $_ ...

  8. Netfilter 之 钩子函数注册

    通过注册流程代码的分析,能够明确钩子函数的注册流程,理解存储钩子函数的数据结构,如下图(点击图片可查看原图): 废话不多说,开始分析: nf_hook_ops是注册的钩子函数的核心结构,字段含义如下所 ...

  9. 20182303 2019-2020-1 《数据结构与面向对象程序设计》第2&3周学习总结

    目录 教材学习内容总结 教材学习中的问题和解决过程 代码调试中的问题和解决过程 代码托管 上周考试错题总结 结对及互评 点评 学习进度条 教材学习内容总结 教材第二章内容 学习Java基本数据类型以及 ...

  10. markdown简单的使用方法

    转自 https://www.cnblogs.com/math/p/se-tools-001.html 作者:正交分解 1.如何切换编辑器 切换博客园编辑器为MarkDown:MarkDown Edi ...