Question

JavaScript的：

$('.addTable').live('click', function () {
    var appendTxt = "<table id='tab1'>  
                <tr><td><input type='text'   name='input1' /></td><td><input type='text'   name='input2' /></td>
                    <td><input type='button' class='addRow' value='Add Row' /></td></tr></table>";
    $("table:last").after(appendTxt);
});

$('.addRow').live('click', function () {
    var appendTxt = "<td><input type='text'name='input1' /></td><td><input 
                type='text'name='input2' /></td><td><input type='button' class='addRow' value='Add Row'/></td> ";
    $("tr:last").after(appendTxt);
});

HTML：

<table id="tab">
    <tr>
        <td>
            <input type="text" name="input1" />
        </td>
        <td>
            <input type="text" name="input2" />
        </td>
        <td>
            <input type="button" class="addRow" value="Add Row" />
        </td>
    </tr>
</table>

<input type="button" class="addTable" value="addTable" />

当我点击“添加行”按钮时，我会动态获得一个新行。当我点击“添加表格”按钮时，我得到一张新表。

但是在此之后，当我在新表和旧表中点击“添加行”时，我在最后添加的表中添加了一行，因为我放了$("tr:last").after(appendTxt) 所以它附加在最新表中的最新<tr>中。

有没有更好的方法来做到这一点，当我点击“新表”时，我可以在相应的表中添加一行？

Answer 1

在您的评论之后。

变化：

$("tr:last").after(appendTxt);

要：

$(this).closest('table').find('tr:last').after(appendTxt);

我假设您添加新行的每个表中都存在“添加行”按钮。

动态添加表格和它的内容在HTML＆amp; jQuery的

1 个答案: