使用jQuery动态添加/删除HTML元素

时间:2010-07-30 06:29:00

标签: jquery

我在this great code找到了Demo。我只需要做一些改变。我想

  • 逐行删除当前行
  • 删除前的确认

你能帮帮我吗?

谢谢,

更新1: 我喜欢这个 alt text http://imagik.fr/thumb/275405.jpeg

1 个答案:

答案 0 :(得分:5)

demo

的HTML

<form id="myForm">
    <div style="margin-bottom:4px;" class="clonedInput">
        <input type="button" class="btnDel" value="Delete" disabled="disabled" />
        <input type="text" name="input1" />
    </div>

    <div>
        <input type="button" id="btnAdd" value="add another name" />
    </div>
</form>​

的jQuery

$(document).ready(function() {

    var inputs = 1; 

    $('#btnAdd').click(function() {
        $('.btnDel:disabled').removeAttr('disabled');
        var c = $('.clonedInput:first').clone(true);
            c.children(':text').attr('name','input'+ (++inputs) );
        $('.clonedInput:last').after(c);
    });

    $('.btnDel').click(function() {
        if (confirm('continue delete?')) {
            --inputs;
            $(this).closest('.clonedInput').remove();
            $('.btnDel').attr('disabled',($('.clonedInput').length  < 2));
        }
    });


});

资源