jQuery之克隆事件--clone()与clone(true)区别

最新推荐文章于 2020-05-24 22:51:31 发布

weixin_30571465

最新推荐文章于 2020-05-24 22:51:31 发布

阅读量1.9k

点赞数

文章标签： javascript 前端 ViewUI

原文链接：http://www.cnblogs.com/dongxixi/p/10976634.html

版权

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>

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

转载于:https://www.cnblogs.com/dongxixi/p/10976634.html

weixin_30571465

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery之克隆事件--clone()与clone(true)区别

clone()与clone(true)同为克隆clone()表示复制标签本身，clone(true)会将标签绑定的事件一起复制来看案例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</...
复制链接

扫一扫