jquery动态添加删除一行数据示例
更新时间:2014年06月12日 09:04:42 投稿:whsnow
这篇文章主要介绍了jquery如何动态添加删除一行数据,需要的朋友可以参考下
复制代码 代码如下:
<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>
相关文章
jquery.tagsinput.js实现记录checkbox勾选的顺序
这篇文章主要为大家详细介绍了jquery.tagsinput.js实现记录checkbox勾选的顺序,具有一定的参考价值,感兴趣的小伙伴们可以参考一下2019-09-09jQuery结合PHP+MySQL实现二级联动下拉列表[实例]
二级联动的实现方法还真不少,实用性也很强,这里结合一个学生信息表的实例,来分享一下我的实现过程2011-11-11JQuery中$.each 和$(selector).each()的区别详解
这篇文章主要介绍了JQuery中$.each 和$(selector).each()的区别详解,本文给出了多个例子讲解了它们之间的不同之处,需要的朋友可以参考下2015-03-03jQuery实现单击按钮遮罩弹出对话框(仿天猫的删除对话框)
单击删除按钮或者登陆按钮后,弹出对话框问你是否删除或者弹出一个登陆对话框,本文使用jquery来实现这种效果,需要的朋友可以参考下2014-04-04
最新评论