jquery - 如何使用jquery在html表中动态添加新行

Question

在此处输入图像描述

在我的 html 表中，我有几个输入元素。我想在表的末尾插入一行新的输入元素，当用户在填写最后一个年龄列后点击输入按钮时。我希望这张照片能让事情更清楚.. 是否可以使用 jquery，因为我是 jquery 的新手。任何形式的帮助将不胜感激..

score 4 · Accepted Answer

对您的表格 html 结构进行一些猜测，总体思路是这样的：

$('input.last').keyup(function handleEnter(e){
    //enter hit on the input that has class last
    if(e.which == 13) {

       $(this).removeClass('last').unbind('keyup');

       $('.myTable').append('<tr><td><input name="input1"/></td><td><input name="input1"/> </td><td><input name="input1" class="last"/></td></tr>');

       $('.last').keyup(handleEnter);
    }
});

score 3 · Accepted Answer

在 jquery 中使用最后一行的最后一列作为选择器。触发它的 onclick 事件并在表格末尾添加一个新的 tr

代码在这里

 <script>
            $(document).ready(function () {

                $('#tableId tr:last td:last').click(function () {
                    var tr = $('this').closest('tr');
                    $('#tableId').append(tr);
                });
            });
        </script>