Question

我有一个静态Html表，其中包含一个“添加”按钮，当单击该按钮时，它会创建一个包含一些文本框的新行它附加到这个表。但我的问题是说我有3行，当我点击“添加”我们能够创建新的ROW但上一行的值被复制到正在生成的新行。这是我使用的功能

    $('#btn1').click(function(){
        tr= $("#Tbl tr:last").html();
        num= $('#num').val()*1;
        first= $("#Tbl tr:last").attr('id').substr(4)*1;
        last=first+num;
        for(i=first+1;i<=last;i++) {
            var newtr= tr.replace(first,i);
            $('#Tbl').append('<tr id="txt_'+i+'">'+newtr+'</tr>');
        }   
    });

当添加新行时，如何在选择框中将值选为“ABC”。我使用此语句但是没有锻炼。如何将值设为选中

$('#Tbl tr:last :input').find('input[name="code"]').val('ABC');

Answer 1

正如@Patrick指出的那样，您可能正在复制最后一行的值。那么为什么不在创建新行后清除它们呢？在for循环之后执行此操作：

$('#Tbl tr:last :input').val('');

这应该选择#Tbl表的最后一个tr中的输入字段并从中删除值。这将专门选择最后一行，但现在我看到你要添加一个可变数量的行，所以让我们正确处理。

由于你要附加一堆行，为什么不在添加它们时将它们清理干净？

for(i=first+1;i<=last;i++) {
    var newtr= tr.replace(first,i);
    $('#Tbl').append('<tr id="txt_'+i+'">'+newtr+'</tr>').find(':input').val('');
}

这应该处理尽可能多的行。

Answer 2

我不是一个真正的jQuery英雄，但为什么不简单地使用它？

$('#Tbl tr:last').after('<tr>...</tr>')

Answer 3

当你做

时我认为

tr= $("#Tbl tr:last").html();

从上一行内部抓取所有html（包括该行内任何控件的值）并将其粘贴到新行

Answer 4

当您键入文本框时，它会在HTML中设置“value”属性。所以稍后，当您复制上一行的innerHTML时，它会获取这些“值”属性并在新行中复制它们。

您可能希望将数据保留在脚本中并使用它来生成新行，而不是解析上一行的HTML。

var nextId = 0;
var DEFAULT_ROW_HTML = "<tr id=\"@ID@\"><td><input type=\"text\" /></td>...</tr>";
...
$("#Tbl").append(DEFAULT_ROW_HTML.replace("@ID@", nextId));

知道我的意思，果冻豆？

Answer 5

试试这个：

$('#btn1').click(function(){
    $('#Tbl').each(function(){
        var $table = $(this);
        // Number of td's in the last table row
        var n = $('tr:last td', this).length;
        var tds = '<tr>';
        for(var i = 0; i < n; i++){
            tds += '<td> </td>';
        }
        tds += '</tr>';
        if($('tbody', this).length > 0){
            $('tbody', this).append(tds);
        }else {
            $(this).append(tds);
        }
    });
});

为什么HTML表重复最后一个Value Row值

5 个答案: