Jquery的克隆和重命名输入字段

Question

我有以下：

   <!-- group clone //--> 
       <div class="section"> 
        <div class="parent row infoOn"> 
         <div class="validGroup"> 
          <a title="remove" class="iconClose" href="#">remove</a> 
          <div class="grouping"> 
           <div class="clearfix valid"> 
            <label>Name<span class="iconReq">&nbsp;</span>:</label> 
            <input type="password" class="text inpButton" name="items[0].first"> 
           </div> 
           <div class="clearfix"> 
            <label>Email<span class="iconReq">&nbsp;</span>:</label> 
            <input type="text" class="text inpButton" name="items[0].first"> 
           </div> 
          </div> 
         </div> 
        </div> 
        <div class="row addControl"> 
         <a href="#" class="button">Add</a> 
        </div> 
       </div> 
       <!-- group clone //--> 

和jqery：

$(function(){ 
    // Control clone 
    $('div.addControl a.button').click(function (e){ 
     e.preventDefault(); 
     var parent = $(this).closest('.section').find('.parent:last'); 
     var parentInput = parent.clone(); 
     parentInput.find("input").val(""); 
     parent.after(parentInput); 

    }); 
    $('div.validGroup a.iconClose').live('click', function (e){ 
     e.preventDefault(); 
     if ($(this).closest('.section').find('.parent').length > 1){ 
      $(this).closest('div.parent').remove(); 

     } 
    }); 
    reflesh(); 
}); 

1. 点击 “添加” 按钮移除从输入字段 值和克隆 的组（2个输入字段）。
2. 点击“删除”链接删除 组

问：如何将我改变它，以便添加或删除新组时，输入字段将被重新命名为name="items[INDEX].first"和name="items[INDEX].last"

例如。如果只有一个 “组”，输入字段的名称将为：

• name="items[0].first"
• name="items[0].last"

，如果我再加一条，新人们必须

• name="items[1].first"
• name="items[1].first"

等等。 当我删除第一个（items[0].first），第二个的输入名称将从"items[1].first"修改为items[0].first。

这里是我的样子：

感谢

Answer 1

我想通了：

var size = parseInt($('.form .section .parent').size()); 
$('.form .section .parent').each(function(index){ 
    $(this).find('input.text').each(function(){ 
     $(this).attr("name", $(this).attr("name").replace($(this).attr("name").match(/\[[0-9]+\]/), "["+index+"]")); 
    }); 
    if (size > 1) { $(this).find('a.iconClose').show(); }else{ $(this).find('a.iconClose').hide(); } 
}); 

Answer 2

$('.add-more').on('click',function(){ 
var newelement= $(".form-content").eq(0).clone(); 
var num = $('.form-content').length; 
var newNum = num + 1; 
newelement.find('input').each(function(i){ 
    $(this).attr('name',$(this).attr('name')+newNum); 
    $(this).attr('id',$(this).attr('id')+newNum); 
}); 
$('.form-content').last().after(newelement); 
});