<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.2.1.js"></script>
</head>
<body>
<div id="outer">
<div id="item">
<input value="+" type="button" onclick="add(this)">
<input type="text" size="10px">
</div>
</div>
<script>
function add(ev) {
var copyer=$(ev).parent().clone(); // 设置一个变量等于要拷贝的内容,找到此标签的父级,clone()克隆.
copyer.children(":button").attr("value","-").attr("onclick","del(this)"); //按设定需求 把克隆内容里的value和onclick事件改变
$("#item").after(copyer); // 或者用$("#outer").append(copyer); 一个是找到兄弟的加入同级标签,一个是找到父级标签
//加入的方法也不同
}
function del(ev) {
$(ev).parent().remove()
}
</script>
</body>
</html>
本例是为了用jquery实现标签的添加,并改变元素.点加号可以增加复制的input标签,但是属性已经被改变,这里用到了colne()克隆方法;如果点减号,则删除了添加的本行.

jquery点击事件后增加克隆的标签,并改变克隆的属性加入的更多相关文章

  1. jQuery点击事件绑定onClick和on()

    一.静态绑定 (1)onclick方法 jsp代码 <button href="javascript:;" class="weui_btn weui_btn_min ...

  2. jquery点击事件失效原因和解决办法

    在使用jQuery绑定点击事件的时候,有时候会遇到点击无效,这种情况大多出现在动态添加元素的时候 例如:给demo里添加li元素给li绑定点击事件 $("#demo").appen ...

  3. Jquery 点击事件重复获取叠加 (一)

    用jquery添加绑定事件 添加多少次 点击的时候就触发多少次 如果想解决这个问题 就在点击函数里先用 $(对象).off("click") 取消上一次的点击事件 上码: $(&q ...

  4. 关于jQuery点击事件叠加问题

    先来看个例子: html: <body> <button id="btn">按钮</button> <button id="bt ...

  5. Android studio关于点击事件后的页面跳转,选择完成后返回(onActivityResult)

    我这个人喜欢直接上代码,在代码中说明更方便,更直接. 首先在.xml中设置一个button按钮,和一个EditText框,并分别做好id号. 这里我以籍贯测试对象. <LinearLayout ...

  6. jquery trigger 触发事件小计 -- 关于a标签

    jquery -- trigger触发执行事件方法虽然好用,偶尔也会出些小问题. 在最近得一个项目中需要触发a标签的点击事件时,我就遇到了点小问题.我很想当然的写层这样:$("a" ...

  7. 17_点击事件第四种写法_布局文件添加onclick属性

    尽量不要用第四种点击事件的写法.在一万多行代码中发现了一个没被调用的代码 public void call(View v){//第四种写法参数一定是View v //public void call( ...

  8. jQuery触发<a>标签的点击事件后URL不跳转的解决办法

    有HTML代码如下: <a id="workFrame" href="pages/work.html" target="FrameBox&quo ...

  9. 实现Jquery触发一事件后,停留5秒,再接着触发下面的事件

    这里是一个广告位的Jquery的代码,有两个不同的广告位,一个是中间浮动显示的,显示5秒后自动消失,并限定每天仅出现一次(Cookie实现): //=====================广告位的j ...

随机推荐

  1. EF 热加载 Winform/Asp.net

    public partial class Form1 : Form { BackgroundWorker worker = new BackgroundWorker(); xxContext cont ...

  2. IP地址和子网划分

    前期知识准备 二进制 和十进制 二进制数据是用0和1表示的数,进位规则为缝二进1, 二进制和十进制的关系 二进  十进 0 1 10 2 100  4 1000 8    10000 16 10000 ...

  3. 使用sshkey,禁用密码登陆,以及git仓库的搭建

    使用sshkey,可以实现免密码登陆服务器,同时关闭ssh service的使用账号密码登陆功能即可 1.首先在客户机添加sshkey(如果是window系统的话需要安装shell终端工具,例如xsh ...

  4. 如何下载网页上的视频 并且 flv 格式转化成 MP4

    链接:http://www.jb51.net/softjc/222135.html https://jingyan.baidu.com/article/25648fc162f2899190fd0042 ...

  5. 基于openstack搭建百万级并发负载均衡器的解决方案

    最近,喜欢研究一些国外技术大咖们的文章,而这篇文章是基于openstack负载均衡器的解决方案,做的一些总结~希望能够给小伙伴带来一些灵感或者帮助. openstack现有的负载均衡解决方案,无论是l ...

  6. 魔方方法之--类的构造(__init__,__new__)和析构(__del__)方法

    构造方法(参见小甲鱼入门教程) __ init__()方法:类的初始化方法,初始化类对象时被调用,需要的时候再调用它 注意点:这个方法的返回值必须是None class Rectangle(): de ...

  7. JDBC_设计架构_驱动类加载_建立Connection_效率测试

    JDBC(Java DataBase Connection) 访问数据库流程:驱动管理器--连接数据库--sql语句--结果集 装载mysql驱动 Class.forName("com.jd ...

  8. opencv学习笔记(五)----图像的形态学操作

    图像的形态学操作有基本的腐蚀和膨胀操作和其余扩展形态学变换操作(高级操作)-----开运算,闭运算,礼帽(顶帽)操作,黑帽操作...(主要也是为了去噪声,改善图像) 形态学操作都是用于处理二值图像(其 ...

  9. 自定义内核启动后的Logo

    1.使用图像GIMP工具   2.详细步骤如下:   A.将800x480的图片导入到GIMP工具.   B.选中GIMP菜单栏进行以下操作     图像         -->模式       ...

  10. ubuntu 上的python不能解析jpeg,png?

    在安装pillow之前需要先安装以下支持包1.apt-get install libjpeg-dev libfreetype6-dev zlib1g-dev libpng12-dev2.安装pillo ...