table标签添加行和删除行(Jquery)

相关jsp代码，可参看：

<tr height=10>
<td colspan=3 align="right">
<input id="additem" type="button" name="saveitem" value="添加选项" onClick="insertRows()">
</td>
</tr>
------------------------------------------------------
<table cellspacing="0" cellpadding="1" rules="all" id="dictTbl">
<tr>
<td id="bianhao" class="ta_01" align="center">编号</td>
<td id="mingcheng" class="ta_01" align="center" width="60%">名称</td>
<td id="shanchu" class="ta_01" align="center">删除</td>                   
</tr>
<tr>
<td class="ta_01" align="center" width="20%">1</td>
<td class="ta_01" align="center" width="60%">
<input name="itemname" type="text" size="45" maxlength="25">
</td>
<td class="ta_01" align="center" width="20%"></td>
</tr>
</table>

添加和删除行的js方法：

function insertRows() {
var tb1 = $("#dictTbl");
var tempRow = $("#dictTbl tr").size();
var $tdNum = $("<td align='center'></td>");
$tdNum.html(tempRow);
var $tdName = $("<td align='center'></td>");
$tdName.html("<input id='"+tempRow+"' name='itemname' type='text' size='45' maxlenth='25'>");
var $tdDel = $("<td align='center'></td>");
$tdDel.html("<a href='#' onclick='delTableRow("+tempRow+")'><img src=../images/delete.gif width=15 height=14 border=0 style=cursor:hand></a>");
var $tr = $("<tr></tr>");
$tr.append($tdNum);
$tr.append($tdName);
$tr.append($tdDel);
    tb1.append($tr);
}

function delTableRow(rowNum) {
var tb1 = $("#dictTbl");
var tempRow = $("#dictTbl tr").size();
if (tempRow > rowNum) {
        $("#" + rowNum).parent().parent().remove();
// 加1表示寻找下一个id，目的是将后面tr的格式向上移动
for (i = (parseInt(rowNum) + 1); i < tempRow; i++) {
// 将i-1的值赋值给编号
            $("#" + i).parent().prev().html(i - 1);
// 将i-1的值赋值给超链接的删除
            $("#" + i).parent().next().html("<a href='#' onclick='delTableRow("+ (i - 1)+ ")'><img src=../images/delete.gif width=15 height=14 border=0 style=cursor:hand></a>");//
// 将i-1的值赋值给文本框的id，用于删除
            $("#" + i).attr("id", (i - 1));
        }
    }
}