table表的行的增加和删除
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript" src="../../../jquery-1.7.js"></script>
</head>
<body>
?? ?<table border="1" id="tableAdd">
?? ??? ?<tr align="center">
?? ??? ??? ?<td width="100px;">展馆</td>
?? ??? ??? ?<td width="100px;">展位类型</td>
?? ??? ??? ?<td width="100px;">数量</td>
?? ??? ??? ?<td width="100px;">
?? ??? ??? ??? ?<input type="button" value="新增" id="addRow"/>?? ??? ??? ?
?? ??? ??? ?</td>?? ??? ?
?? ??? ?</tr>
?? ?</table>
</body>
</html>
<script type="text/javascript">
?? ?$(document).ready(function(){
?? ??? ?var rowNum=0;
?? ??? ?//新增行
?? ??? ?$("#addRow").bind("click",function(){
?? ??? ??? ?rowNum +=1;
?? ??? ??? ?var rowHtml="";
?? ??? ??? ?rowHtml +="<tr id='"+rowNum+"'>";
?? ??? ??? ??? ?rowHtml +="<td>"+rowNum+"</td>";
?? ??? ??? ??? ?rowHtml +="<td></td>";
?? ??? ??? ??? ?rowHtml +="<td></td>";
?? ??? ??? ??? ?rowHtml +="<td>";
?? ??? ??? ??? ??? ?rowHtml +="<input type="button" value="删除" name="deleteRow" onclick="deleteRow("+rowNum+")" />";
?? ??? ??? ??? ?rowHtml +="</td>";
?? ??? ??? ?rowHtml +="</tr>";
?? ??? ??? ?//alert(rowHtml)
?? ??? ???? $("#tableAdd").append(rowHtml);?? ??? ??? ?
?? ??? ?})?? ?
?? ?})
?? ??? ?//删除行
?? ?function deleteRow(num){
?? ??? ??? ?$("#addRow").parent().parent().parent().find("#"+num).remove();?? ??? ?
?? ??? ?}
</script>
