1

我有以下示例:http: //jsfiddle.net/Jm7Kp/

这里的想法是动态创建表,表内的按钮只在该表中创建行。

<div id="divPrincipal">
</div>
<button id="btnAdd">Add</button>

<script>
    var objDivPrincipal = $("#divPrincipal");
    var tbl;
    $("#btnAdd").click(function () {
        createTable();
    });

    function createTable() {
        tbl = $("<table border=1><thead><tr><td>FName</td><td>LName</td></tr></thead><tbody></tbody><tfoot><tr><td><button class='btnAddRow'>AddRow</button></td><td></td></tr></tfoot></table></br>");
        objDivPrincipal.append(tbl);
        tbl.find(".btnAddRow").click(function () {
            $(this).parent().parent().parent().after("<tr><td>John</td><td>Snow</td></tr>");
        });
    }
</script>

我不喜欢使用 parent().parent().parent()... 我尝试使用 parent('tbody') 和最接近的('tbody') 但没有用。即使是 parent('table').find('tbody') 也不起作用。

谢了。

4

2 回答 2

2

采用:

$(this).closest('table').append("<tr><td>John</td><td>Snow</td></tr>");

jsFiddle 示例

于 2013-11-08T17:11:56.427 回答
1

那是因为它不在同一个祖先中,您的添加按钮在 a 中tfoot,所以尝试:

$(this).closest("tfoot").prev("tbody").append("<tr><td>John</td><td>Snow</td></tr>");

你也不想append——after所以上面找到最接近的tfoot,然后是前一个tbody,并附加一个新的tr

演示:http: //jsfiddle.net/Jm7Kp/7/

于 2013-11-08T17:13:05.920 回答