使用JQuery 表单动态添加和删除行

1 html代码：

<table class="table" style="width: 100%;" id="djtable">

<tr>

<th style="width:8%;text-align:center;" >序号</th>

<th style="width:60%;text-align:center;" >选项内容</th>

<th style="width:8%;text-align:center;" class="score">最高分值</th>

<th style="width:8%;text-align:center;" >

<div class="btn_tool">

<a href="javascript:addvotesub()"> 增加 </a>

</div>

</th>

</tr>

</table>

2 js代码

var rownum=0;//控制行数

function addvotesub() {

var name=rownum;

var VOTESUBSN = '<td style="text-align:center;"><input class="votesubsn" style="width:35px;" maxlength="6"
name="votesubsn'+name+'" value="'+name+'"/><font color="red">*</font></td >';

var VOTESUBCONTENT = '<td style="text-align:center;"><input style="width:400px;" class="votesubcontent" maxlength="200"
name="votesubcontent'+name+'" /><font color="red">*</font></td >';

var MAXGRADE = '<td class="score" style="text-align:center;"><input style="width:35px;" class="maxgrade" style="width:35px;"
maxlength="6" name="maxgrade'+name+'" ><font color="red">*</font></td >';

var has_maxgrade = '<tr>' + VOTESUBSN +VOTESUBCONTENT + MAXGRADE;

has_maxgrade += '<td style="text-align:center;"><a href="javascript:void(0);" onclick="delRow(this)">删除</a></td></tr>';

rownum++;

//动态添加

$("#djtable").append(has_maxgrade);

}

//删除一行投票细项

function delRow(td) {

if (confirm("您确定要删除选中记录吗？")) {

var txt = $(td).parent().parent().html();

$(td).parent().parent().remove();

}

}