在html中的指定索引处插入新行

Question

我正在使用html表。我想动态地向该表插入一个新行，如按钮单击。我这样试过，

var rows = $(this.element).find("tbody").find("tr");
prevElem = rows[index];
$("<tr><td>data</td><tr>").insertBefore(prevElem);

但是，它不起作用。如何在指定的索引处插入新行？

提前致谢，

-Raja。

Answer 1

看看here：

$('#txtIndex').val($('#tblAddMe tbody tr').length);
$('#btnAdd').click(function() {
  var indx = $('#txtIndex').val() - 1;
  var newRow = $('<tr><td>New Row Added' + $('#tblAddMe tbody tr').length + '</td></tr>');
  newRow.insertBefore($('#tblAddMe tbody tr:nth(' + indx + ')'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tblAddMe">
  <tbody>
    <tr>
      <td>Row 1</td>

    </tr>
    <tr>
      <td>Row 2</td>

    </tr>
  </tbody>
</table>
<input id="txtIndex" />
<button type="button" id="btnAdd">Add</button>

我做了一个在元素之前插入行的工作示例。

Answer 2

应为$('<tr><td>...<td></tr>').insertBefore(prevElem);

Answer 3

索引是0，所以要成为第4行，你需要i-1。

应该是：prevElem = rows[index-1];