使用javascript动态地在表格的最后一行中添加一行

时间:2012-06-07 06:03:17

标签: javascript html

我在引用“http://stackoverflow.com/questions/9045940/dynamically-adding-table-row”时创建了一个表,每当我进入表的最后一行时,我需要在其中添加另一行动态地在底部的表,这是我尝试的代码:

<table id="myTable" style="table-layout:auto">

   <tr>
   <td><input type="text" onblur="addRow('myTable')" /></td>
    <td><input type="text"/></td>
    <td><input type="text"/></td>
  </tr>

</table>

和javascript如下:

<script>
function addRow()
{
   //add a row to the rows collection and get a reference to the newly added row
   var newRow = document.all("myTable").insertRow();

   var oCell = newRow.insertCell();
   oCell.innerHTML = "<input type='text' onblur='addRow();'>";

   oCell = newRow.insertCell();
   oCell.innerHTML = "<input type='text' name='title'>";

   oCell = newRow.insertCell();
   oCell.innerHTML = "<input type='text' name='title'>";   
}

</script>

但是,这里在表格的顶部添加了一个新行,我该怎么办?

1 个答案:

答案 0 :(得分:2)

更改var newRow = document.all("myTable").insertRow();

var newRow = document.all("myTable").insertRow(-1);

此外,在您的onblur事件中,为什么在没有参数的情况下将参数传递给addRow函数?