複製錶行，並增加所有name屬性

Question

讓我們像這樣的表：

<table> 
<tr> 
    <td><input type="text" name="FirstName1" /></td> 
    <td><input type="text" name="LastName1" /></td> 
</tr> 
<tr> 
    <td><input type="text" name="FirstName2" /></td> 
    <td><input type="text" name="LastName2" /></td> 
</tr> 
</table> 

我想有一個按鈕，將在與遞增的名稱表的末尾添加新行屬性，這樣它看起來像這樣：

<table> 
<tr> 
    <td><input type="text" name="FirstName1" /></td> 
    <td><input type="text" name="LastName1" /></td> 
</tr> 
<tr> 
    <td><input type="text" name="FirstName2" /></td> 
    <td><input type="text" name="LastName2" /></td> 
</tr> 
<tr> 
    <td><input type="text" name="FirstName3" /></td> 
    <td><input type="text" name="LastName3" /></td> 
</tr> 
</table> 

依此類推。

到目前爲止，我有這個，但它不會增加name屬性：

$("#newRowButton").click(function(){ 
    $("table tr:last").clone().appendTo("table"); 
}); 

Answer 1

$("#newRowButton").click(function() { 
    $("table tr:last") 
     .clone() 
     .appendTo("table") 
     .find(':input') 
     .attr('name', function(index, name) { 
      return name.replace(/(\d+)$/, function(fullMatch, n) { 
       return Number(n) + 1; 
      }); 
     }) 
}); 

得到name屬性和增量

Live demo。

Answer 2

$("#newRowButton").click(function(){ 
    var trows = $("table tr:last").clone(); 
    trows.find('td input').attr("name",function(i,a){ 
    var p = new RegExp("((?:[a-z][a-z]+))(\\d+)",["i"]); 
    var m = p.exec(a); 
    var index = parseInt(m[1]); 
    index++; 
    return m[0]+index; 
    }); 
    trows.appendTo("table"); 
}); 

Answer 3

var clonedRow = $("#EventType tr:last").clone(); 
$("input", clonedRow).attr('name', 'FirstName3'); // reset the name 

您可以通過1

Reference