<html>

<head>

<title>加入、删除一行</title>

<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<script type="text/javascript" src="../js/jquery-1.9.1.js"></script>

<script type="text/javascript">

	$(function() {

		$("#addOneRow").click(function() {

			var tempTr = $("tr:first").clone(true);

			$("tr:last").after(tempTr);

			$("tr:last > td > #name").val("");//新加入行name为空

			$("tr:last > td > #address").val("");//新加入行address为空

		});

		$(".delOneRow").click(function() {

			if ($("tr").length < 2) {

				alert("至少保留一行!");

			} else {

				if (confirm("确认删除?")) {

					// $(this).parent().parent().remove();

					$(this).parents("tr").remove();

				}

			}

		});

	});

</script>

</head>

<body>

	<table border="1">

		<tr>

			<td>姓名:</td>

			<td><input type="text" id="name" name="name" />

			</td>

			<td>地址:</td>

			<td><input type="text" id="address" name="address" /></td>

			<td><input type="button" class="delOneRow" value="删除" /></td>

		</tr>

	</table>

	<input type="button" id="addOneRow" value="加入一行" />

</body>

</html>

jquery动态加入删除一行数据的更多相关文章

  1. linux 下 vi 文本编辑如何复制一行粘贴删除一行数据

    在使用vi有时会想直接复制一行数据,然后粘贴一行或者直接删除一行数据 复制一行数据的方法 把光标放到要复制的一行前面,然后按两下yy字母键 然后把光标放到要复制到的地方去,按键盘的p字母键 删除一行是 ...

  2. jQuery动态添加删除CSS样式

    jQuery框架提供了两个CSS样式操作方法,一个是追加样式addClass,一个是移除样式removeClass,下面通过一个小例子讲解用法. jQuery动态追加移除CSS样式 <!DOCT ...

  3. jQuery动态添加删除与添加表行代码

    具体实现代码如下: table的HTML如下: 代码如下 复制代码 <input type="button" value="添加一行" />< ...

  4. datatables01 安装、数据源、选中行事件、新增一行数据、删除一行数据

    1 安装 1.1 引入必要文件 要在项目中使用datatables需要引入三个文件 >DataTables CSS >jQuery >DataTables JS <!-- Da ...

  5. Repeater 动态增加删除一行

    文章参考:文章参考http://www.cnblogs.com/dataadapter/archive/2012/06/25/2562885.html 效果: 前台代码: <%@ Page La ...

  6. jQuery动态添加删除select项

    // 添加 function col_add() { var selObj = $("#mySelect"); var value="value"; var t ...

  7. jquery动态添加删除div--事件绑定,对象克隆

    我想做一个可以动态添加删除div的功能.中间遇到一个问题,最后在manong123.com开发文摘 版主的热心帮助下解答了(答案在最后) 使用到的jquery方法和思想就是:事件的绑定和销毁(unbi ...

  8. vue简单案例_动态添加删除用户数据

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. jquery动态添加/删除 tr/td

    <head runat="server"> <title></title> <!--easyui --> <link rel= ...

随机推荐

  1. Android菜鸟的成长笔记（10）——使用Bundle在Activity之间传值

    原文:[置顶] Android菜鸟的成长笔记(10)——使用Bundle在Activity之间传值 前面我们了解了如何启动一个Activity,一个Activity在启动另外一个Activity的时候 ...

  2. SpringMVC开发过程中的中文乱码问题

    相信大家在开发初期遇到中文乱码问题一定是一头雾水,不是数据库乱码了就是页面乱码了或者传值时乱码.其实解决乱码的途径很简单,就是统一编码与解码的类型,我把自己遇到的乱码问题整理出来,希望能够对大家有用. ...

  3. php运行

    运行命令: $php 1.php php教程: http://www.w3school.com.cn/php/php_variables.asp

  4. 浅析innodb_support_xa与innodb_flush_log_at_trx_commit

    很久以前对innodb_support_xa存在一点误解,当初一直认为innodb_support_xa只控制外部xa事务,内部的xa事务是mysql内部进行控制,无法人为干预(这里说的内部xa事务主 ...

  5. Cygwin的安装及在Android jni中的简单使用举例

    Cygwin是一个在windows平台上执行的类UNIX模拟环境,是cygnussolutions公司开发的自由软件.Cygwin是很多自由软件的集合,Cygwin的主要目的是通过又一次编译.将POS ...

  6. exe解析

    IMAGE_DOS_HEADER      size   0x40 e_lfanew                           0xe0 当中有0xA0的间隔数据. IMAGE_NT_HEA ...

  7. Delaunay三角剖分算法

    在图像处理中,经常会使用到三角剖分算法: 具体定义及其算法可以参考:http://baike.so.com/doc/5447649.html 下面放出来代码: Delaunay接口为存C: 测试是使用 ...

  8. java学习笔记13--比较器(Comparable、Comparator)

    java学习笔记13--比较器(Comparable.Comparator) 分类: JAVA 2013-05-20 23:20 3296人阅读 评论(0) 收藏 举报 Comparable接口的作用 ...

  9. hdu 4963（中途相遇法）

    题目链接:Dividing a String 题意:给定一个2*n(n<=20)的字符串及每个位置的字符包含的权重,求将该字符串分成两个子序列S1.T1,要求S1=T1且abs(weight1- ...

  10. Android开发5：布局管理器2(表格布局TableLayout)

    版本:Android4.3 API18  学习整理:liuxinming 概念      TableLayout继承了LinearLayout,因此它的本质依然是线性布局管理器.      表格布局采 ...