Jquery 使用表单字段重复div

我有一个表单，我希望能够复制一组字段，只要我想。我还希望这些新字段组的属性的字段

id

，

name

，以及标签的

，增加1。到目前为止，我已经在jQuery中尝试了这个方法，并使它至少复制了字段组，但remove不起作用。我不知道如何为这3个属性中的每一个加1。我很感激能得到的任何帮助

这是其中的一部分，

HTML

克隆对象后使用此选项

胡闹：）

我会给你留一些待办事项，把3号改成当前的id号

<script type="text/javascript">
$.fn.id_changer = function(new_id) {
  return this.each(function(){
    $(this).find('input').each(function(){
        var ob = $(this);
        ob.attr('id',   this.id.replace(/_\d$/, '_' + new_id));
        ob.attr('name', this.name.replace(/_\d$/, '_' + new_id));           
    });
  });
};


$.fn.id\u changer=功能（新的\u id）{
返回此值。每个（函数（）{
$（this）.find（'input'）.each（function（）{
var ob=$（本）；
ob.attr（'id'，this.id.replace（/\ud$/，'uu'+new\u id））；
ob.attr（'name'，this.name.replace（/\d$/，'\u'+new\u id））；
});
});
};

这将根据以下三个元素自动重命名：

// Add a new repeating section
$('.addFight').click(function(){
    var currentCount =  $('.repeatingSection').length;
    var newCount = currentCount+1;
    var lastRepeatingGroup = $('.repeatingSection').last();
    var newSection = lastRepeatingGroup.clone();
    newSection.insertAfter(lastRepeatingGroup);
    newSection.find("input").each(function (index, input) {
        input.id = input.id.replace("_" + currentCount, "_" + newCount);
        input.name = input.name.replace("_" + currentCount, "_" + newCount);
    });
    newSection.find("label").each(function (index, label) {
        var l = $(label);
        l.attr('for', l.attr('for').replace("_" + currentCount, "_" + newCount));
    });
    return false;
});

// Delete a repeating section
$('.deleteFight').live('click',function(){
    $(this).parent('div').remove();
    return false;
});​

我将delete处理程序改为use，这样该处理程序也将附加到该按钮的新创建副本。现在，如果您使用的是jquery>1.7，那么应该使用

on（）版本将是：

// Delete a repeating section
$(document).on('click','.deleteFight',function(){
    $(this).parent('div').remove();
    return false;
});

这是我的版本


它严重依赖于重复区域的索引。因此，不要在上面添加任何兄弟姐妹。如果确实需要，请将所有重复区域包装到另一个div中

该死！太晚了：）无论如何。。。这是密码

// Add a new repeating section
var attrs = ['for', 'id', 'name'];
function resetAttributeNames(section) { 
    var tags = section.find('input, label'), idx = section.index();
    tags.each(function() {
      var $this = $(this);
      $.each(attrs, function(i, attr) {
        var attr_val = $this.attr(attr);
        if (attr_val) {
            $this.attr(attr, attr_val.replace(/_\d+$/, '_'+(idx + 1)))
        }
      })
    })
}

$('.addFight').click(function(e){
        e.preventDefault();
        var lastRepeatingGroup = $('.repeatingSection').last();
        var cloned = lastRepeatingGroup.clone(true)  
        cloned.insertAfter(lastRepeatingGroup);
        resetAttributeNames(cloned)
    });

// Delete a repeating section
$('.deleteFight').click(function(e){
        e.preventDefault();
        var current_fight = $(this).parent('div');
        var other_fights = current_fight.siblings('.repeatingSection');
        if (other_fights.length === 0) {
            alert("You should atleast have one fight");
            return;
        }
        current_fight.slideUp('slow', function() {
            current_fight.remove();

            // reset fight indexes
            other_fights.each(function() {
               resetAttributeNames($(this)); 
            })            
        })   
    });


​

如果您使用
name=method[]
etc等作为字段，您将在POST变量中获得数组，因此不需要显式索引。
完全符合我的需要。我试着让它工作。在上，因为我确实使用了最新的jQuery，但在我弄明白之前你已经响应了。非常感谢！：）没问题；-）是的，我想我更愿意添加它，而不是留下不推荐的代码。提示：编写可重用的代码，以便将来遇到同样的情况时可以“重用”代码。另外，作为jQuery的座右铭，少写代码多做！此小提琴中的删除功能不起作用：-（请注意只添加功能解决方案。使用
$（'form'）。在（'click'，'deleteFight'，function（）{
上，若要修复删除问题我喜欢此解决方案，您还可以帮助了解如何在单击“提交”按钮时将所有重复部分中提交的值保存到测试文件吗？
// Delete a repeating section
$(document).on('click','.deleteFight',function(){
    $(this).parent('div').remove();
    return false;
});

// Add a new repeating section
var attrs = ['for', 'id', 'name'];
function resetAttributeNames(section) { 
    var tags = section.find('input, label'), idx = section.index();
    tags.each(function() {
      var $this = $(this);
      $.each(attrs, function(i, attr) {
        var attr_val = $this.attr(attr);
        if (attr_val) {
            $this.attr(attr, attr_val.replace(/_\d+$/, '_'+(idx + 1)))
        }
      })
    })
}

$('.addFight').click(function(e){
        e.preventDefault();
        var lastRepeatingGroup = $('.repeatingSection').last();
        var cloned = lastRepeatingGroup.clone(true)  
        cloned.insertAfter(lastRepeatingGroup);
        resetAttributeNames(cloned)
    });

// Delete a repeating section
$('.deleteFight').click(function(e){
        e.preventDefault();
        var current_fight = $(this).parent('div');
        var other_fights = current_fight.siblings('.repeatingSection');
        if (other_fights.length === 0) {
            alert("You should atleast have one fight");
            return;
        }
        current_fight.slideUp('slow', function() {
            current_fight.remove();

            // reset fight indexes
            other_fights.each(function() {
               resetAttributeNames($(this)); 
            })            
        })   
    });


​