所以这就是我的情况。我有一个无序的列表，在列表中有一组输入和一个可以克隆其中4个输入的按钮。由于数据来自后端，所以可以有一个或1000个列表集。因此，我试图根据列表索引号动态地为列表中的每个输入赋予名称属性，并为克隆的输入找到一种方法。如果您查看类pm providerNum，我正在执行与提供程序名称类似的操作，因此它基于列表数量。如果我添加更多列表，则提供程序名称会自动更改。回到名称，所以对于李数字1，除了动态创建的输入之外，在每个输入上都是如此。每个输入名称都像这个
在添加位置等动态输入上，输入名称为：
<input type="text" name="p-address-0-dynamic#[dynamicnumber]" class="pm-
psubmit" placeholder="First Name" required="">
等等。。。。dynamicnumber是表示新创建的输入数量的数字。因此，如果没有向提供程序1/索引1添加其他位置，则上的每个输入名称动态输入将是：
<input type="text" name="p-address-0-dynamic#[0]" class="pm-psubmit"
placeholder="First Name" required="">
如果我添加一个额外的位置。这些输入将被命名为
<input type="text" name="p-address-0-dynamic#[1]" class="pm-psubmit"
placeholder="First Name" required="">
清单2/索引2
<input type="text" name="p-address-1-dynamic#[0]" class="pm-psubmit"
placeholder="First Name" required="">
如果我添加一个额外的位置。这些输入将被命名为
<input type="text" name="p-address-1-dynamic#[1]" class="pm-psubmit"
placeholder="First Name" required="">
我花了一些时间提出这个问题，它可能会让人困惑，希望你们明白我想说的。我尝试了很多不同的方法来做到这一点，但都没有成功。希望我能得到一些见解
$('.pm-providerNum').each(function (index) {
$(this).html('Providor ' + (index + 1));
});
$("div.pm-providor-first-wrap").each(function (index) {
$(this).find('input').each(function () {
$(this).attr('name', $(this).attr('name')+ '-' + index);
})
});
$(document).on("click", ".pm-add-loc-Class", function () {
var $sect = $(this).closest(".pm-loc-section");
$sect.find(".pm-loc-inputWrapper").eq(0).clone().show().insertBefore($sect.find(".pm-loc-controls")).find('input').val('');
});<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<title></title>
</head>
<body>
<div class="col-sm-12 pm-submitProvidor">
<ul>
<li>
<div class="">
<h4><span class="pm-providerNum"></span></h4>
<div class="pm-providor-first-wrap">
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" name="p-first_name" placeholder="First Name" required="" type="text">
</div>
<div class="col-md-1">
<input class="pm-psubmit" name="p-middle_name" placeholder="M" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-last_name" placeholder="Last Name" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-dob" placeholder="Date of birth" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-personal_num" placeholder="Personal Phone #" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-personal_email" placeholder="Personal Email" required="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" name="p-degree" placeholder="Degree" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-d_date" placeholder="Date" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-dobe" placeholder="Data of board exam" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-nri_num" placeholder="NRI #" required="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-2">
<input class="pm-psubmit" name="p-prim_spec" placeholder="Primary Speciality" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-sec_spec" placeholder="Secondary Speciality" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-practice_name" placeholder="Practice name" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-practice_num" placeholder="Practice Phone #" required="" type="text">
</div>
</div>
</div>
<div class="row" style="padding-left:15px; padding-right:15px;">
<div class="pm-loc-section">
<div class="pm-loc-inputWrapper">
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" placeholder="Practice Physical Address" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="City" required="" type="text">
</div>
<div class="col-md-1">
<input class="pm-psubmit" placeholder="State" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="Zip" required="" type="text">
</div>
<div class="col-md-4"></div>
</div>
</div>
<div class="pm-loc-controls text-right">
<input class="pm-add-loc-Class" type="button" value="+ Add Another Location">
</div>
</div>
</div>
</div>
</li>
<li>
<div class="">
<h4><span class="pm-providerNum"></span></h4>
<div class="pm-providor-first-wrap">
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" name="p-first_name" placeholder="First Name" required="" type="text">
</div>
<div class="col-md-1">
<input class="pm-psubmit" name="p-middle_name" placeholder="M" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-last_name" placeholder="Last Name" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-dob" placeholder="Date of birth" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-personal_num" placeholder="Personal Phone #" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-personal_email" placeholder="Personal Email" required="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" name="p-degree" placeholder="Degree" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-d_date" placeholder="Date" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-dobe" placeholder="Data of board exam" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-nri_num" placeholder="NRI #" required="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-2">
<input class="pm-psubmit" name="p-prim_spec" placeholder="Primary Speciality" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-sec_spec" placeholder="Secondary Speciality" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-practice_name" placeholder="Practice name" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-practice_num" placeholder="Practice Phone #" required="" type="text">
</div>
</div>
</div>
<div class="row" style="padding-left:15px; padding-right:15px;">
<div class="pm-loc-section">
<div class="pm-loc-inputWrapper">
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" placeholder="Practice Physical Address" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="City" required="" type="text">
</div>
<div class="col-md-1">
<input class="pm-psubmit" placeholder="State" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="Zip" required="" type="text">
</div>
<div class="col-md-4"></div>
</div>
</div>
<div class="pm-loc-controls text-right">
<input class="pm-add-loc-Class" type="button" value="+ Add Another Location">
</div>
</div>
</div>
</div>
</li>
<li>
<div class="">
<h4><span class="pm-providerNum"></span></h4>
<div class="pm-providor-first-wrap">
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" name="p-first_name" placeholder="First Name" required="" type="text">
</div>
<div class="col-md-1">
<input class="pm-psubmit" name="p-middle_name" placeholder="M" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-last_name" placeholder="Last Name" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-dob" placeholder="Date of birth" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-personal_num" placeholder="Personal Phone #" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-personal_email" placeholder="Personal Email" required="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" name="p-degree" placeholder="Degree" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-d_date" placeholder="Date" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-dobe" placeholder="Data of board exam" required="" type="text">
</div>
<div class="col-md-3">
<input class="pm-psubmit" name="p-nri_num" placeholder="NRI #" required="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-2">
<input class="pm-psubmit" name="p-prim_spec" placeholder="Primary Speciality" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-sec_spec" placeholder="Secondary Speciality" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-practice_name" placeholder="Practice name" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" name="p-practice_num" placeholder="Practice Phone #" required="" type="text">
</div>
</div>
</div>
<div class="row" style="padding-left:15px; padding-right:15px;">
<div class="pm-loc-section">
<div class="pm-loc-inputWrapper">
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" placeholder="Practice Physical Address" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="City" required="" type="text">
</div>
<div class="col-md-1">
<input class="pm-psubmit" placeholder="State" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="Zip" required="" type="text">
</div>
<div class="col-md-4"></div>
</div>
</div>
<div class="pm-loc-controls text-right">
<input class="pm-add-loc-Class" type="button" value="+ Add Another Location">
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>我会这样做：对于每个"providor"组，所有的输入名称属性都以类似provider[index]的东西开头，然后让每个特定字段的名称成为第二维输入：provider[1][firstname]、provider[1][lastname]等。
然后，对于您的位置字段，在末尾添加一个额外的索引，以指示它属于哪个位置组：
provider[1][city][1]-
provider[1][state][1] -
provider[1][city][2] provider[1][state][2]
等。
您还可以使用.data()函数来存储提供者索引和位置索引，这种方式以后可以更容易地获取。
下面是一个工作示例：
$('.pm-providerInputGroup').each(function (index)
{
var inputGroupId = index + 1;
var groupEl = $(this);
groupEl.data('groupId', inputGroupId);
groupEl.find('.pm-providerNum').html('Providor ' + inputGroupId);
groupEl.find('.pm-psubmit').each(function()
{
var cleanName = $(this).attr('placeholder').toLowerCase().replace(/[^a-z0-9]+/g, '');
$(this).attr('name', 'providor[' + inputGroupId + '][' + cleanName + ']');
});
groupEl.find('.pm-loc-section .pm-loc-inputWrapper').each(function(index2)
{
var locGroupId = index2 + 1;
$(this).data('locGroupId', locGroupId);
$(this).find('.pm-psubmit').each(function()
{
var curName = $(this).attr('name');
$(this).attr('name', curName + '[' + locGroupId + ']');
});
});
});
$(document).on("click", ".pm-add-loc-Class", function()
{
var $sect = $(this).closest(".pm-loc-section");
var lastLocGroup = $sect.find(".pm-loc-inputWrapper").eq(-1);
var lastLocGroupId = lastLocGroup.data('locGroupId');
var newLocGroup = lastLocGroup.clone();
var newLocGroupId = lastLocGroupId+1;
newLocGroup.show().insertBefore($sect.find(".pm-loc-controls")).find('input').val('');
newLocGroup.data('locGroupId', newLocGroupId);
newLocGroup.find('.pm-psubmit').each(function(index2)
{
var curName = $(this).attr('name');
var newName = curName.replace(/(w+[[^]]+][[^]]+])([[^]]+])/, '$1[' + newLocGroupId + ']' );
$(this).attr('name', newName);
});
}); <!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<title></title>
</head>
<body>
<div class="col-sm-12 pm-submitProvidor">
<ul>
<li>
<div class="pm-providerInputGroup">
<h4><span class="pm-providerNum"></span></h4>
<input class="pm-psubmit" placeholder="First Name" required="" type="text">
<input class="pm-psubmit" placeholder="M" type="text">
<input class="pm-psubmit" placeholder="Last Name" required="" type="text">
<input class="pm-psubmit" placeholder="Date of birth" required="" type="text">
<input class="pm-psubmit" placeholder="Personal Phone #" type="text">
<input class="pm-psubmit" placeholder="Personal Email" required="" type="text">
<input class="pm-psubmit" placeholder="Degree" required="" type="text">
<input class="pm-psubmit" placeholder="Date" required="" type="text">
<input class="pm-psubmit" placeholder="Data of board exam" required="" type="text">
<input class="pm-psubmit" placeholder="NRI #" required="" type="text">
<input class="pm-psubmit" placeholder="Primary Speciality" required="" type="text">
<input class="pm-psubmit" placeholder="Secondary Speciality" required="" type="text">
<input class="pm-psubmit" placeholder="Practice name" required="" type="text">
<input class="pm-psubmit" placeholder="Practice Phone #" required="" type="text">
<div class="row" style="padding-left:15px; padding-right:15px;">
<div class="pm-loc-section">
<div class="pm-loc-inputWrapper">
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" placeholder="Practice Physical Address" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="City" required="" type="text">
</div>
<div class="col-md-1">
<input class="pm-psubmit" placeholder="State" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="Zip" required="" type="text">
</div>
<div class="col-md-4"></div>
</div>
</div>
<div class="pm-loc-controls text-right">
<input class="pm-add-loc-Class" type="button" value="+ Add Another Location">
</div>
</div>
</div>
</div>
</li>
<li>
<div class="pm-providerInputGroup">
<h4><span class="pm-providerNum"></span></h4>
<input class="pm-psubmit" placeholder="First Name" required="" type="text">
<input class="pm-psubmit" placeholder="M" type="text">
<input class="pm-psubmit" placeholder="Last Name" required="" type="text">
<input class="pm-psubmit" placeholder="Date of birth" required="" type="text">
<input class="pm-psubmit" placeholder="Personal Phone #" type="text">
<input class="pm-psubmit" placeholder="Personal Email" required="" type="text">
<input class="pm-psubmit" placeholder="Degree" required="" type="text">
<input class="pm-psubmit" placeholder="Date" required="" type="text">
<input class="pm-psubmit" placeholder="Data of board exam" required="" type="text">
<input class="pm-psubmit" placeholder="NRI #" required="" type="text">
<input class="pm-psubmit" placeholder="Primary Speciality" required="" type="text">
<input class="pm-psubmit" placeholder="Secondary Speciality" required="" type="text">
<input class="pm-psubmit" placeholder="Practice name" required="" type="text">
<input class="pm-psubmit" placeholder="Practice Phone #" required="" type="text">
<div class="row" style="padding-left:15px; padding-right:15px;">
<div class="pm-loc-section">
<div class="pm-loc-inputWrapper">
<div class="row">
<div class="col-md-3">
<input class="pm-psubmit" placeholder="Practice Physical Address" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="City" required="" type="text">
</div>
<div class="col-md-1">
<input class="pm-psubmit" placeholder="State" required="" type="text">
</div>
<div class="col-md-2">
<input class="pm-psubmit" placeholder="Zip" required="" type="text">
</div>
<div class="col-md-4"></div>
</div>
</div>
<div class="pm-loc-controls text-right">
<input class="pm-add-loc-Class" type="button" value="+ Add Another Location">
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>