<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <input id="t1" type="text" />

    <input id="a1" type="button" value="添加" />

    <input id="a2" type="button" value="删除" />

    <input id="a3" type="button" value="复制" />

    <ul id="u1">

        <li>1</li>

        <li>2</li>

    </ul>

    <script src="jquery.js"></script>

    <script>

        $('#a1').click(function () {

            var v = $('#t1').val();

            var temp = "<li>" + v + "</li>";

            // $('#u1').append(temp);

            $('#u1').prepend(temp);

            // $('#u1').after(temp)

            // $('#u1').before(temp)

        });

        $('#a2').click(function () {

            var index = $('#t1').val();

            //$('#u1 li').eq(index).remove();

            //$('#u1 li').eq(index).empty();

        });

        $('#a3').click(function () {

            var index = $('#t1').val();

            var v = $('#u1 li').eq(index).clone();

            $('#u1').append(v);

            //$('#u1 li').eq(index).remove();

            //$('#u1 li').eq(index).empty();

        })

    </script>

</body>

</html>

　　使用on事件与body托管解决动态生成标签触发js脚本不生效的问题

     $(document).on('click','.edit',function(){
        $('.c1 , .c2').removeClass('hide')
     });

//     $("body").delegate(".edit","click", function(){
//          $('.c1 , .c2').removeClass('hide')
//      });
     $("body").delegate(".del","click", function(){
          console.log('1231');
        $(this).parent().parent().remove()
      });

标签的增加、删除与复制，动态标签js不生效的解决的更多相关文章

  1. JQ input输入框回车生成标签，可删除，并获取标签的值

    在网上找的,效果如下 html代码 <!DOCTYPE html> <html lang="zh-CN"> <head> <title&g ...

  2. [Swift通天遁地]一、超级工具-(1)动态标签：给UILabel文字中的Flag和url添加点击事件

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  3. jQuery创建、删除和修改html标签

    1.在父标签内创建子标签,新创建的子标签放在父标签最下面 $(parent).append(son).$(son).appendTo(parent) <div class="d&quo ...

  4. Mybatis:缓存,动态SQL,注解SQL以及动态标签使用

    1 转义字符 字符 转义 描述 < < 小于 <= <= 小于等于 > > 大于 >= >= 大于等于 <> <> 不等于 &a ...

  5. dedecms删除没有文章的标签

    要批量的删除织梦TAG标签,那我们就只能在数据库里做修改了. 登录数据库,在数据库里执行以下SQL语句: delete FROM dede_tagindex where typeid not in ( ...

  6. 正则表达式删除指定的HTML 标签

    1.抓取某网页的数据后(比如描述),如果照原样显示的话,可能会因为它里面包含没有闭合的HTML标签而打乱了格式,也可能它里面用了比较让人 "费解" 的HTML标签,把预订的格式搅乱 ...

  7. bootstrap中的动态加载出来的图片轮播中的li标签中的class="active"的动态添加移除

    //该方法是在slide改变时立即触发该事件, $('#myCarousel').on('slide.bs.carousel', function () { $("#myCarousel o ...

  8. 如何让帝国CMS7.2搜索模板支持动态标签调用

    帝国cms站内搜索一般不支持动态标签调用,如果要调用如何实现呢?修改两个地方就可以实现了.打开 /e/search/result/index.php 文件,找到(文件改了,不会调用也是徒劳!看看这个帝 ...

  9. a标签在编辑器中可以整体删除并且a标签为不可编辑的情况下 标签依然存在(棒棒哒)

    a标签在编辑器中可以整体删除并且a标签为不可编辑的情况下 标签依然存在 因为给a标签的后面 添加了一个空元素,如<i></i>(棒棒哒)<div contentEdita ...

随机推荐

  1. dict/json转xml

    在json转xml时,首先传进来的一定是一个dict,如果不是需要转一下,然后开始迭代,遇到dict则递归,如果是list则循环递归,否则认为是文字,将其写入,逻辑不复杂,因为为了代码循环不是太频繁, ...

  2. OGG replicat复制进程的拆分

    参考资料: 1.https://blog.csdn.net/datingting1/article/details/79583690

  3. php内置函数分析之trim()

    官方手册中: 类似函数还有两个:ltrim() 和 rtrim().分别处理字符串的左侧.右侧. trim()的具体实现位于:ext/standard/string.c /* {{{ proto st ...

  4. php io

    1.获取目录下文件,不包括子目录 //获取某目录下所有文件.目录名(不包括子目录下文件.目录名) $handler = opendir($dir); while (($filename = readd ...

  5. java基础复习（四）

    ---恢复内容开始--- 一.for循环的掌握  语法格式: for( 初始化语句A   ;  条件判断B  ;  循环后功能语句C){ //循环体D } for的执行流程:   整个for循环结构中 ...

  6. Task3.PyTorch实现Logistic regression

    1.PyTorch基础实现代码 import torch from torch.autograd import Variable torch.manual_seed(2) x_data = Varia ...

  7. SQLite和MySQL数据库的差别与应用

    简单来说,SQLITE功能简约.小型化,追求最大磁盘效率:MYSQL功能全面,综合化.追求最大并发效率.假设仅仅是单机上用的,数据量不是非常大.须要方便移植或者须要频繁读/写磁盘文件的话.就用SQLi ...

  8. Django2 + python3 上传图片

    . ├── db.sqlite3 ├── manage.py ├── myImg │   ├── __init__.py │   ├── __pycache__ │   │   ├── __init_ ...

  9. 使用WebAPI流式传输大文件（在IIS上大于2GB）

    这里只写后端的代码,基本的思想就是,前端将文件分片,然后每次访问上传接口的时候,向后端传入参数:当前为第几块文件,和分片总数 下面直接贴代码吧,一些难懂的我大部分都加上注释了: 上传文件实体类: 看得 ...

  10. FastDFS的安装及上传下载(二)

    百度云:所有附件的地址 一 安装前的检查 检查Linux上是否安装了 gcc.libevent.libevent-devel,执行如下yum命令检查: [root@node02 ~]# yum lis ...