Javascript jquery追加和删除：删除顺序不正确

我试图实现一个功能，用户可以添加和删除两个文本字段，即标题和说明，使用jquery，添加更多功能可以正常工作，但删除顺序不正确

她的问题就在于此

Jquery

此外，我还需要一件事，当用户单击“添加更多”按钮时，我会显示一个标签，如果添加其他项目，则会显示第1天，依此类推。

您可以这样做

$('#btnAddMore').click(function() {
  var clone = $(append).clone()
  $('#appendContent').append(clone);
  clone.find(".form-group > label").text("Day " + $("#appendContent").children().length);
});
$('body').on('click', '.remove', function() {
  //alert('ok');
  $(this).parent().remove();
});

使用克隆创建新创建的div的副本。 然后使用.find.form-group>label.text更改克隆内的标签 通过计算appendContentDiv的子级来获取当前div的编号 追加/删除后更新标签文本 给出一些类来标识容器的父元素。 $'.days'.textfunctionindex{ 返回“天”+索引+1 }; 给主要部门上课

var append='<div class="minus"><div class="form-group">

---

查看附加的代码段：

/*作为外部资源包含的最新编译和缩小的JavaScript*/ var-append=''； 追加+=‘说明’； 追加+='Remove'； $'btnAddMore'。单击函数{ $'appendContent:last'.beforeappend； var i=1； $'input[type=text]'。每个函数{ $this.prev.html'Day'+i； $this.attr'name'、'subHeading'+i； $this.attr'id'，副标题'+i； i++； }; }; $'body'。单击，'.remove'，函数{ //警惕‘ok’； $this.parent.remove； var i=1； $'input[type=text]'。每个函数{ $this.prev.html'Day'+i； $this.attr'name'、'subHeading'+i； $this.attr'id'，副标题'+i； i++； }; }; /*作为外部资源包含的最新编译和缩小的CSS*/ /*可选主题*/ @导入url'//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap theme.min.css'； 身体{ 利润率：10px； } 阿德莫尔

---

你的JSFIDLE看起来很好用，问题出在哪里呢？与其在JSFIDLE的链接上随意标记非代码为代码，还不如把代码放在问题中。提示：堆栈片段[工具栏按钮]可用于在此处创建可运行的演示。添加3个以上的项目，然后尝试删除。它将删除第一个项目。每次删除我想要的项目时，我都会删除，我不理解您的问题……您没有处理这样一个事实，即一旦删除了一个项目，您就可以获得重复的天数removed@A.Wolff ,是的，你是对的。。但我不确定OP需要如何处理它。它可以正常工作，但如果我随机删除一个项目天计数顺序不正确再次OP的顺序是不匹配的

var append='<div class="minus"><div class="form-group">

$(this).closest('.minus').remove();

var appendContentSize = $('#appendContent .appended-element').size();
       $('#btnAddMore').click(function(){
            var append='<div class="appended-element"><div class="form-group"> <label>Day '+appendContentSize+'</label><input type="text" value="" name="subHeading" class="form-control"></div>';

       append+='<div class="form-group"> <label>Description</label> <textarea class="form-control" name="description"></textarea>';
       append+='</div><button type="button" class="btn btn-danger remove" id="btnAddMore">Remove</button></div>';
           $('#appendContent').append(append);
           appendContentSize++
       });
       $('body').on('click','.remove',function(){
           //alert('ok');
           if(appendContentSize > 0){
                $(this).parent().remove();
            appendContentSize--
           }
       });