0

私は終日学習を行い、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();
});
4

6 に答える 6

6

そのようです?

$('#btnRemove').on('click', function() {
    $('.clonedInput').last().remove();
});
​

デモ: http://jsfiddle.net/P8bTz/2/

于 2012-06-15T04:50:21.220 に答える
2

ボタンを追加し、次の行をそれにバインドします。

$(".clonedInput").last().remove();
于 2012-06-15T04:49:39.380 に答える
2
$('div.clonedInput:last').remove();
于 2012-06-15T04:49:46.797 に答える
0

http://jsfiddle.net/P8bTz/1/をお試しください

于 2012-06-15T04:56:02.123 に答える
0

http://jsfiddle.net/P8bTz/3/これは、あなたが望む動作を無効にする削除ボタンも示すはずです

于 2012-06-15T04:57:24.047 に答える
0

最後jqueryは次のようにトリックを行います:

$('#your_doms_id').last().remove();
于 2012-06-15T05:20:50.073 に答える