添加和删​​除输入字段

Question

我需要在用户点击addAgent按钮时添加4个输入字段。我还允许用户从其中一个中删除。如果用户添加4个输入字段，我想禁用添加按钮。如果用户删除了这4个输入字段中的一个，则根据用户删除或添加的输入数量，再启用一个添加按钮或另外两个添加按钮。但最多只有四个。我想用jQuery，我能得到的任何帮助或样本吗？谢谢！

Answer 1

这是工作的jsfiddle [DEMO]

 <div id="add">Add</div>
    <div id="container"></div>

$('#add').bind('click', function() {
    if($('#container').find('input').length < 4) {
        $('#container').append('<div><input type="text"><span class="remove">remove</span></div>');
    }
})

$('body').on('click', '.remove', function() {
    if($('#container').find('input').length > 0) {
        $(this).parent().remove();
    }
})

Answer 2

也许这就是你要找的东西？ 您可以创建四个输入：

 <div class='control'>
        <input type='text' value='' />
        <a href='#' class='remove'>Remove</a>
    </div>
    <div class='control'>
        <input type='text' value='' />
        <a href='#' class='remove'>Remove</a>
    </div>
    <div class='control'>
        <input type='text' value='' />
        <a href='#' class='remove'>Remove</a>
    </div><div class='control'>
        <input type='text' value='' />
        <a href='#' class='remove'>Remove</a>
    </div>

然后你可以编写jquery来隐藏它们并在点击按钮时显示它们。

像这样： http://jsfiddle.net/kSH7M/1