Javascript动态表格处理

<table id="transferTable">

<tr tag="0"><td style="width:150px">区号</td><td>转接号码 <input type="button" value=" 新增行 " onclick="addRow();"></td></tr>

<c:if test="${callCenterFlow.flowTransfers != null}">

<c:forEach items="${callCenterFlow.flowTransfers}" var="e" varStatus="status">

<tr id="${status.index+1}">

<td><input type='text' name='keys' size='10' value="${e.key}"></td>

<td>

<textarea rows='2' cols='50' name='transferNos' id="transferNos${status.index+1}">${e.transferNos}</textarea>

<input type="button" value="选择" onclick="selectTransfer('transferNo${status.index+1}')">

<a href='javascript:deleteRow(${status.index+1});'>删除</a>

</td>

</tr>

</c:forEach>

</c:if>

</table>

<script type="text/javascript">

function addRow(){

var table = $("transferTable");

var newRow = table.insertRow(table.rows.length);

var index = table.rows.length - 1;

newRow.index = index;

var areaCell = newRow.insertCell(0);

areaCell.innerHTML="<input type='text' name='keys' size='10'>";

var transferCell = newRow.insertCell(1);

transferCell.innerHTML="<textarea rows='2' cols='50' name='transferNos' id='transferNos"+index+"'></textarea><input type='button' value='选择' onclick=\"selectTransfer('transferNos"+index+"');\"><a href='javascript:deleteRow("+index+");'>删除</a>";

}

function deleteRow(index){

var table = $("transferTable");

for(var i=0;i<table.rows.length;i++){

if(table.rows[i].index == index || table.rows[i].id == index){

table.deleteRow(i);

break;

}

}

}

</script>