Javascript 删除和创建新节jquery时无法更新计数器

/*动态创建Phoen*/
var phoneList=[]；
函数add_phone（）{
var index=phoneList.length+1；
phoneList.push（'phone:'+索引）；
var divtest=''+
'电话（'+索引+'）'+
''+
''+
' '+
''+
''+
''+
' '+
' '+
''+
‘20152016年’+
'20172018  '+
'  ';
$（“#教育_字段”）.append（divtest）；
updatePhonePicker（）；
}
功能移除手机（rid）{
$（“#phone#u picker option[value=”“+rid+”]）。删除（）；
$（'.removeclass'+rid）.remove（）；
splice（phoneList.indexOf（rid），1）；
updatePhonePicker（）；
}
函数updatePhonePicker（）{
变量选项='--'；
forEach（函数（元素、索引）{
选项+=''+元素+''
})
$（'#tab_logic'）。查找（'tr'）。每个（函数（ind，ele）{
var r=$（ele.find（“#phone_picker”）.empty（）.append（选项）；
});
}
/*在此处添加有关手机的详细信息*/
$（文档）.ready（函数（）{
var i=1；
$（“#添加_行”）。单击（函数（）{
$（'#addr'+i）.html（“+（i+1）+”->”；
$（'#tab_logic'）。追加（''）；
i++；
updatePhonePicker（）；
});
$（“#删除_行”）。单击（函数（）{
如果（i>1）{
$（“#addr”+（i-1））.html（“”）；
我--；
}
});
});

电话信息
添加电话。
电话选择其他详细信息。
#
电话
类型
载体
1.
---
添加电话删除电话
您只需编写另一个函数，如
updatePhonePicker（）
即可更新
中显示的数字

以下是函数：

1-首先将计数器显示屏围成一个范围，并给它一个类（反类）：
…Phone（“+index+”）

2-每行给它一个类（.someClass）

我想你的问题出在add_电话的第一行

var index = phoneList.length+1;

我会删除“+1”，因为如果您添加第一项，它将得到html类removeclass1，但在电话列表数组中有索引0。要删除此电话，请调用removePhone（1），但实际上它的索引为0，因此您不删除任何电话，或者更确切地说是删除错误的电话。
您的问题在这一行：

 var index = phoneList.length+1;

因为您使用removeclass1、removeclass2等类创建了新的div。。。。。你可以考虑直接得到最后一个div，因此提取数字而不是一个增量：

var index = 1;
if ($('#education_fields > div').length > 0) {
    index = 1 + +$('#education_fields > div:last').attr('class').match(/.*removeclass(\d+).*/)[1];
}

根据您的评论：

好的，这很好，但是如果您向下查看表格列“Phone”和选择/下拉列表，则在删除“Phone”部分时，它似乎没有得到更新

您可以更改updatePhonePicker，以便动态生成直接从div获取数据的选项：

发件人：

phoneList.forEach（函数（元素，索引）{
选项+=''+元素+''
})

致：

$（'#教育字段>div>span'）。每个（函数（idx、ele）{
var txt=ele.textContent.replace（/[（）]/g'，）.trim（）；
选项+=''+txt+''
})


var-phoneList=[]；
函数add_phone（）{
var指数=1；
如果（$（'#教育_字段>div'）。长度>0）{
index=1++$（'#education_fields>div:last'）.attr（'class'）.match（/.*removeclass（\d+）.*/）[1]；
}
phoneList.push（'phone:'+索引）；
var divtest=''+
'电话（'+索引+'）'+
''+
''+
' '+
''+
''+
''+
' '+
' '+
''+
‘20152016年’+
'20172018  '+
'  ';
$（“#教育_字段”）.append（divtest）；
updatePhonePicker（）；
}
功能移除手机（rid）{
$（“#phone#u picker option[value=”“+rid+”]）。删除（）；
$（'.removeclass'+rid）.remove（）；
splice（phoneList.indexOf（rid），1）；
updatePhonePicker（）；
}
函数updatePhonePicker（）{
变量选项='--'；
$（“#教育_字段>div>span'）。每个（函数（idx、ele）{
var txt=ele.textContent.replace（/[（）]/g'，）.trim（）；
选项+=''+txt+''
})
$（'#tab_logic'）。查找（'tr'）。每个（函数（ind，ele）{
var r=$（ele.find（“#phone_picker”）.empty（）.append（选项）；
});
}
/*在此处添加有关手机的详细信息*/
$（文档）.ready（函数（）{
var i=1；
$（“#添加_行”）。单击（函数（）{
$（'#addr'+i）.html（“+（i+1）+”->”；
$（'#tab_logic'）。追加（''）；
i++；
updatePhonePicker（）；
});
$（“#删除_行”）。单击（函数（）{
如果（i>1）{
$（“#addr”+（i-1））.html（“”）；
我--；
}
});
});

电话信息
添加电话。
电话选择其他详细信息。
#
电话
类型
载体
1.
---
var index = 1;
if ($('#education_fields > div').length > 0) {
    index = 1 + +$('#education_fields > div:last').attr('class').match(/.*removeclass(\d+).*/)[1];
}

phoneList.forEach(function(element, index){
    options+='<option value="'+element+'">'+element+'</option>'
})

$('#education_fields > div > span').each(function(idx, ele) {
    var txt = ele.textContent.replace(/[()]/g, '').trim();
    options+='<option value="'+txt+'">'+txt+'</option>'
})