我做了一些整天的学习,我想出了如何使用 jquery 为我的表单动态添加行。但是现在我无法终生弄清楚如何删除最后添加的行。
$('#btnAdd').click(function() {
var num = $('.clonedInput').length;
var newNum = new Number(num + 1);
var newElem = $('#input' + num).clone().attr('id', 'input' + newNum);
newElem.children('.client').attr('id', 'client' + newNum).attr('name', 'client' + newNum);
newElem.children('.color').attr('id', 'color' + newNum).attr('name', 'color' + newNum);
$('#input' + num).after(newElem);
$('#btnDel').attr('disabled','');
if (newNum == 5)
$('#btnAdd').attr('disabled','disabled');
});
<form id="myForm">
<div id="input1" style="margin-bottom:4px;" class="clonedInput">
<select name="client" id="client" class="client">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type="text" name="color" id="color" class="color"/>
</div>
<div>
<input type="button" id="btnAdd" value="Add Row" />
</div>
</form>
并在 jsFiddle 上为您带来观赏乐趣:Demo
回答 由Blender提供
$('#btnRemove').on('click', function() {
$('.clonedInput').last().remove();
});