Question

我在该表中有一个表，我有一个用于添加新行的按钮。在该表中，我想在用户单击添加行按钮时动态添加新行。我但它不起作用。 JSFiddle中有HTML和JQuery代码。请建议。

<table id="myTable" border="1">
    <tr>
        @*<td>SR</td>*@
        <td>Name</td>
        <td>Age</td>
        <td>Delete?</td>
        <td>Add</td>
    </tr>
    <tr>
        @*<td>1</td>*@
        <td><input size=25 type="text" id="nmbox" /></td>
        <td><input size=25 type="text" id="agbox" /></td>
        <td><input type="button" id="delRow" value="Delete" onclick="deleteRow(this)" /></td>
        <td><input type="button" id="addRow" value="Add " onclick="insRow()" /></td>
    </tr>
</table>

var new_row1 = $('#mytable tr:last').clone();
$('#mytable').append(new_row1);

Answer 1

1）id选择器不匹配$('#myTable tr:last').上限T

2）每个元素的id应该是唯一的。

＆＃13;

function insRow(){
var new_row1 = $('#myTable tr:last').clone();
$('#myTable').append(new_row1);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="myTable" border="1">
    <tr>
        @*<td>SR</td>*@
        <td>Name</td>
        <td>Age</td>
        <td>Delete?</td>
        <td>Add</td>
    </tr>
    <tr>
        @*<td>1</td>*@
        <td><input size=25 type="text"  /></td>
        <td><input size=25 type="text"  /></td>
        <td><input type="button"  value="Delete" onclick="deleteRow(this)" /></td>
        <td><input type="button"  value="Add " onclick="insRow()" /></td>
    </tr>
</table>

＆＃13;

Answer 2

在没有jQuery的情况下将子元素添加到克隆的元素中：

 clone = ElementTo.cloneNode();

 while (ElementToBeCloned.firstChild){
     clone.appendChild(ElementToBeCloned.lastChild);
 }

新表行不是使用JQuery克隆方法创建的

2 个答案: