我想逐个字段删除,但它会删除所有字段并阻止添加
var nextinput = 0;
function AgregarCampos() {
nextinput++;
var campo = '<div class="row"><div class="col-xs-4"><p><input type="text" class="form-control" \n\
id="campo" name="nombres" placeholder="Ingrese el nombre" /></p></div> <div class="col-xs-4"><input \n\
type="text" class="form-control" id="campo" name="valores" placeholder="Ingrese el valor" /></div>';
var removeButton = $("<input type=\"button\" class=\"remove\" value=\"-\" />");
removeButton.click(function() {
$(this).parent().remove();
});
$("#campos").append(campo);
$("#campos").append(removeButton);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<p>
<input onclick="AgregarCampos();" type="button" value="Agregar" class="btn btn-primary" />
</p>
<div id="campos">
</div>
问题是当你删除时你有
input
一个孩子,这就是为什么没有添加更多的原因。我对您的代码进行了一些修改:#campos
$(this).parent().remove()
id #campos
campo
像这样保留函数变量:插入按钮以根据需要删除父级。然后创建一个函数来检测
click
按钮的名称:我让你的代码工作:
您好,问题是它删除了所有内容,因为包含您定义的按钮的 div 最终位于输入容器 div 之外,因此唯一的解决方案是重新组织 div。
你像这样嵌入html。这就是问题所在
表格正确
这是可行的解决方案,尽管我更改了一些内容。干杯