jquery动态添加删除一行数据示例
<html>
<head>
<title>添加、删除一行</title>
<metahttp-equiv="content-type"content="text/html;charset=UTF-8">
<scripttype="text/javascript"src="../js/jquery-1.9.1.js"></script>
<scripttype="text/javascript">
$(function(){
$("#addOneRow").click(function(){
vartempTr=$("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>
<tableborder="1">
<tr>
<td>姓名:</td>
<td><inputtype="text"id="name"name="name"/>
</td>
<td>地址:</td>
<td><inputtype="text"id="address"name="address"/></td>
<td><inputtype="button"value="删除"/></td>
</tr>
</table>
<inputtype="button"id="addOneRow"value="添加一行"/>
</body>
</html>
热门推荐
10 同事除夕加班祝福语简短
11 六一互换礼物祝福语简短
12 团队海报祝福语简短英语
13 男友人新婚祝福语简短
14 老人掉牙祝福语简短语
15 迎接朋友蛋糕祝福语简短
16 男生打球祝福语简短霸气
17 天气转凉祝福语简短
18 孙女结婚姥姥祝福语简短