JQuery 实现点击按钮添加及删除 input 框

以下是使用jQuery实现点击按钮添加和删除input框的示例代码：

HTML部分：

<div id="input-container">
    <!-- 这里将动态添加input框 -->
</div>
<button id="add-input">添加输入框</button>

jQuery部分：

$(document).ready(function(){
    var count = 1; // 用于生成不同input的id
 
    // 添加输入框的函数
    function addInput() {
        count++;
        $('#input-container').append('<input type="text" id="input' + count + '" name="input' + count + '" />');
    }
 
    // 删除输入框的函数
    function removeInput() {
        if(count > 0) {
            $('#input' + count).remove();
            count--;
        }
    }
 
    // 绑定添加按钮事件
    $('#add-input').click(function(){
        addInput();
    });
 
    // 绑定删除按钮事件（这里假设有另一个删除按钮）
    $('#remove-input').click(function(){
        removeInput();
    });
});

在这个例子中，我们定义了两个函数addInput和removeInput来处理添加和删除input框的逻辑。通过点击#add-input按钮，会触发addInput函数添加input框，通过点击#remove-input按钮，会触发removeInput函数删除input框（假设存在这样一个按钮）。这里的input框是动态添加到#input-container容器中的。