javascript - jQuery 动态输入字段

Question

我使用此代码来添加和删除输入字段:http://www.sanwebe.com/2013/03/addremove-input-fields-dynamically-with-jquery

我面临的两个问题无法解决:

$(wrapper).append('<div><input type="text" name="mytext[]"/><a href="#" class="remove_field">Remove</a></div>');

我想像这样在 div 中附加一个 div (我正在使用 bootstrap):

$(wrapper).append('<div class="form-group"><input type="text" class="form-control" "name="mytext[]" placeholder="test"><div class="input-group"><span class="input-group-addon"><span class="wb-close"></span></span></div></div>');

这显然是有效的，但是我的 close 函数不再起作用，因为它试图关闭第二个 div，而不是“主”div( <div class="form-group"> 。我如何才能关闭整个添加的div 就像我上面的例子一样？

第二个问题，我使用以下作为我的关闭函数:

<div class="input-group"><span class="input-group-addon"><span class="wb-close"></span></span></div>

但是关闭按钮不适用于跨度图标 wb-close ，它只是不会关闭。我尝试添加 remove_field类到跨度本身，但这也不起作用。

Answer 1

您需要更改选择器，因为您更改了类名称。

试试这个:

$(wrapper).on("click", ".wb-close", function(e) {
    $(this).parent('.form-group').remove(); x--;
});

或者:

$(wrapper).on("click", ".wb-close", function(e) {
    $(this).parent().parent().parent().remove(); x--;
});