我有这样的表:
<table id="myTable" border="1">
<tbody>
<tr><td>Name</td></tr>
<tr><td><input name="field-1" type="text" /></td></tr>
<tr><td><input name="field-2" type="text" /></td></tr>
</tbody>
</table>
我想要一个ADD MORE按钮,所以每当我们点击ADD MORE按钮时,它会添加一个具有唯一NAME的新行,如
<tr><td><input name="field-3" type="text" /></td></tr>
<tr><td><input name="field-4" type="text" /></td></tr>
请提出解决方案。
谢谢!
答案 0 :(得分:2)
$('button#add_more').on('click', function() {
var table = $('table#myTable tbody'),
len = $('input[type=text]', table).length;
table.append('<tr><td><input name="field-'+ (len+1)+'" type="text" /></td></tr>');
})
<强> DEMO 强>
答案 1 :(得分:0)
演示:: http://jsfiddle.net/ankur20us/MTXhZ/
$('#click').click(function(){
var totRows=$('#myTable tr').length;
$('#myTable').append("<tr><td><input name='field-"+ totRows +"' type='text' /></td></tr>")
});