Question

我在创建动态trs时面临问题

当我点击添加更多行时，它应该能够为每个TR生成动态ID。

它应该像rownumber_1，rownumber_2一样生成。

但是它总是只生成rownumber_2，我的错误。请帮助

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Dynamic Row</title>
<script type="text/javascript" src="jquery-1.9.1.js"></script> 
<script language="javascript"> 
$(document).ready(function(){
// generate new row
$('#addButton').on('click', function(event){
 var i = $('#addButton').size() + 1;   
var newRow = '<TR id="rownumber_' + i +'"><td><input type="text" name="" value="" id=""  ></td><td><input type="text" name="" value="" ></td><td><input type="text" name=""  ></td></tr>';
 i++;
$('#room').append(newRow);        
    });
});
</script>
</head>
<body>

<table width="42%" border="1" cellspacing="1" cellpadding="1" style="border-collapse:collapse;"  id="room" >
  <tr>
    <td>Col1</td>
    <td>Col2</td>
    <td>Col3</td>
    <td><a href="#" align=left id="addButton" >Add More Rows</a></td>
  </tr>
    <tr>
    <td><input type="text" name=""  ></td>
    <td><input type="text" name=""  ></td>


    <td><input type="text" name=""  ></td>

  </tr>
</table>

Answer 1

使用：

var i = $('#room tr[id*="rownumber_"]').size() + 1;

Answer 2

$('#addButton').size()将始终返回1（因为ID应该是唯一的）所以

var i = $('#addButton').size() + 1

将始终返回2.
我想您想要使用$("#room tr").size()，它会为您提供现有行数。使用

var i = $("#room tr").size() + 1

Answer 3

简单只需添加此项，每次都会计算到现在为止的计数行，然后为下一行添加1

var i=   $('#room tr').length +1;

使用Jquery创建动态动态三元组

3 个答案: