Question

我不是很擅长Javascript而且不能让一件事工作。我有一张桌子，就像这样：

<table>
    <tr><td>test #1</td><td><a href="#">Here we go1!</a></td></tr>
    <tr><td>test #2</td><td><a href="#">Here we go2!</a></td></tr>
    <tr><td>test #3</td><td><a href="#">Here we go3!</a></td></tr>
</table>

我需要在按下链接的行之后插入带有一些内容（不是克隆）的新行。

换句话说，在第一行按<a>后，表格必须如下：

<table>
    <tr><td>test #1</td><td><a href="#">Here we go1!</a></td></tr>
    <tr><td>some content here</td><td><a href="#">some content here</a></td></tr>
    <tr><td>test #2</td><td><a href="#">Here we go2!</a></td></tr>
    <tr><td>test #3</td><td><a href="#">Here we go3!</a></td></tr>
</table>

我真的想做点什么，但总是在桌子之前插入。

更新

我插入新行的JS代码看起来像这样：（我尝试使用此处发布的一个解决方案但不起作用）。

function RowAdd()
{
    var table=document.getElementById("test");
    var last=$(this).closest("tr").prevAll().length;
    var row=table.insertRow(last);
    row.insertCell(0);
    row.cells[0].innerHTML="test";
    row.insertCell(1);
    row.cells[1].innerHTML="test";
    row.insertCell(2);
    row.cells[2].innerHTML="test";
}

Answer 1

假设您的表格有id=myTable，您可以使用：

var table = document.getElementById("myTable");
var row = table.insertRow(1);    //inserts row at index 1, like in your example
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "data1";
cell2.innerHTML = "data2";

Answer 2

如果我理解你需要这样做，对吧？

http://jsfiddle.net/OxyDesign/v7swo505/

JS（使用jQuery）

$(document).ready(function(){
    $('body').on('click','table a', function(e){
        $(this).closest('tr').after('<tr><td>New Content 1</td><td><a href="#">New Content 2</a></td></tr>');
    });
});

在行Javascript之后插入一行

2 个答案: