jquery - 在表单加载时在表行中生成新的唯一名称和 ID

Question

<table border="1" id="matt">
<tr> 
     <td><input type="text" id="txtTitle" name="txtTitle"></td> 
     <td><input type="text" id="txtLink" name="txtLink"></td> 
</tr>
<tr> 
     <td><input type="text"></td> 
     <td><input type="text"></td> 
</tr>
<tr> 
     <td><input type="text"></td> 
     <td><input type="text"></td> 
</tr>

<script language="javascript">
var i = 1;
$(window).load(function() {
$("tbody tr:last").find("input").each(function() {
$(this).attr({
  'id': function(_, id) { return id + i },
  'name': function(_, name) { return name + i },
  'value': ''               
});
}).end().appendTo("#matt");
i++;
});
</script>

给定这段代码..我想在表单加载时从表的第一行生成和复制属性/标签，它应该是唯一的..有什么帮助吗？我很难过。

Answer 1

好的，如果您只想将修改后的属性从第一个表行的输入标签复制到表的所有其他行中的输入，您可以使用此算法：

$(document).ready(function () {
    var rows = $("table tbody tr");
    var txtTitle = rows.first().find('input').eq(0);
    var txtLink = rows.first().find('input').eq(1);
    rows.each(function (i) {
        if (i==0) { return; } // skip first row.
        var inputs = $(this).find('input');
        inputs.eq(0).attr('id', txtTitle.attr('id')+i )
            .attr('name', txtTitle.attr('name')+i )
            .attr('value', txtTitle.attr('value')+i );
        inputs.eq(1).attr('id', txtLink.attr('id')+i )
            .attr('name', txtLink.attr('name')+i )
            .attr('value', txtLink.attr('value')+i );
    });
});

上面的代码在这里测试，它的简化版本在这里。

在 jQuery 中克隆一行也很简单，例如：

$('table#matt tbody').append($('table#matt tbody tr:first').clone());