jquery动态添加删除一行数据示例


Posted in Javascript onJune 12, 2014
<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(); 
} 
} 
}); 
}); 
</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>
Javascript 相关文章推荐
jQuery ctrl+Enter shift+Enter实现代码
Feb 07 Javascript
ExtJS4中的requires使用方法示例介绍
Dec 03 Javascript
javascript动态设置样式style实例分析
May 13 Javascript
jQuery插件实现无缝滚动特效
Nov 24 Javascript
js控制TR的显示隐藏
Mar 04 Javascript
简单实现的JQuery文本框水印插件
Jun 14 Javascript
js自调用匿名函数的三种写法(推荐)
Aug 19 Javascript
BootStrap 超链接变按钮的实现方法
Sep 25 Javascript
jQuery实现获取form表单内容及绑定数据到form表单操作分析
Jul 03 jQuery
深入剖析JavaScript instanceof 运算符
Jun 14 Javascript
vue中nextTick用法实例
Sep 11 Javascript
jQuery ajax - getScript() 方法和getJSON方法
May 14 jQuery
checkbox勾选判断代码分析
Jun 11 #Javascript
百度判断手机终端并自动跳转js代码及使用实例
Jun 11 #Javascript
js获取日期:昨天今天和明天、后天
Jun 11 #Javascript
js使用栈来实现10进制转8进制与取除数及余数
Jun 11 #Javascript
删除javascript中注释语句的正则表达式
Jun 11 #Javascript
Jquery自定义button按钮的几种方法
Jun 11 #Javascript
教你用jquery实现iframe自适应高度
Jun 11 #Javascript
You might like
聊天室php&amp;mysql(五)
2006/10/09 PHP
php的access操作类
2008/04/09 PHP
PHP 多进程 解决难题
2009/06/22 PHP
php !function_exists(&quot;T7FC56270E7A70FA81A5935B72EACBE29&quot;))代码解密
2011/01/07 PHP
php 伪静态之IIS篇
2014/06/02 PHP
JS中不为人知的五种声明Number的方式简要概述
2013/02/22 Javascript
jquery控制左右箭头滚动图片列表的实例
2013/05/20 Javascript
js模仿jquery的写法示例代码
2013/06/16 Javascript
JS去除右边逗号的简单方法
2013/07/03 Javascript
jQuery知识点整理
2015/01/30 Javascript
js中不同的height, top的区别对比
2015/09/24 Javascript
JavaScript中Date对象的常用方法示例
2015/10/24 Javascript
JS折半插入排序算法实例
2015/12/02 Javascript
JS中使用apply方法通过不同数量的参数调用函数的方法
2016/05/31 Javascript
详解使用mpvue开发github小程序总结
2018/07/25 Javascript
JS实现获取毫秒值及转换成年月日时分秒的方法
2018/08/15 Javascript
超详细动手搭建一个VuePress 站点及开启PWA与自动部署的方法
2019/01/27 Javascript
Vue + Scss 动态切换主题颜色实现换肤的示例代码
2020/04/27 Javascript
使用纯前端JavaScript实现Excel导入导出方法过程详解
2020/08/07 Javascript
js实现3D粒子酷炫动态旋转特效
2020/09/13 Javascript
常见的在Python中实现单例模式的三种方法
2015/04/08 Python
Python探索之URL Dispatcher实例详解
2017/10/28 Python
python随机取list中的元素方法
2018/04/08 Python
Python实现判断一个整数是否为回文数算法示例
2019/03/02 Python
python增加图像对比度的方法
2019/07/12 Python
Python Web版语音合成实例详解
2019/07/16 Python
python 6行代码制作月历生成器
2020/09/18 Python
OpenCV+python实现膨胀和腐蚀的示例
2020/12/21 Python
39美元购买一副眼镜或太阳镜:39DollarGlasses.com
2018/06/17 全球购物
平面设计师的工作职责
2013/11/21 职场文书
物流专业大学生职业生涯规划书范文
2014/01/15 职场文书
运动会开幕式邀请函
2014/02/03 职场文书
讲文明懂礼貌演讲稿
2014/09/11 职场文书
2015年药店店长工作总结
2015/04/29 职场文书
2019年共青团工作条例最新版
2019/11/12 职场文书
Go语言应该什么情况使用指针
2021/07/25 Golang