Question

您好我有这个jQuery函数来复制表单字段。现在我需要用PHP处理它们，我的问题是克隆的元素具有相同的输入名称。

我想在名称的末尾添加和变量，如_1 _2 _3等等。另外，在一个隐藏字段中放入大量克隆元素以在循环中处理它们会很棒。

我真的不擅长jQuery并且需要它很快，否则我会开始阅读关于它的纪录片并自己做。

也许你们可以帮助我。会大量使用它：）

有jQuery Part：

$(document).ready(function() {
$('#btnAdd').click(function() {
    var num     = $('.clonedInput').length;
    var newNum  = new Number(num + 1);

    var newElem = $('#input' + num).clone().attr('id', 'input' + newNum);

    newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum);
    $('#input' + num).after(newElem);

    $('#btnDel').removeAttr('disabled');

    if (newNum == 10)// Max
        $('#btnAdd').attr('disabled','disabled');
});

$('#btnDel').click(function() {
    var num = $('.clonedInput').length;

    $('#input' + num).remove();
    $('#btnAdd').removeAttr('disabled','');

    if (num-1 == 1)
        $('#btnDel').attr('disabled','disabled');
});

$('#btnDel').attr('disabled','disabled');

}）;

这里是HTML

<div id="input1" class="clonedInput">
<!-- Elements to clone -->
    <div class="control-group">
        <label class="control-label" for="">Firmenname</label>
        <div class="controls">
            <input type="text" class="input-xlarge {validate:{required:true}}" rel="popover" data-content="Der Firmenname ist ein wichtiger Hinweis." data-original-title="Hilfe" id="firma" name="firma">
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="">Branche</label>
        <div class="controls">
            <input type="text" class="input-xlarge" name="branche">
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="">Anschrift</label>
        <div class="controls">
            <input type="text" class="input-xlarge" name="anschrift">
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="">Ansprechpartner</label>
        <div class="controls">
            <input type="text" class="input-xlarge" name="ansprechpartner">
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="">Tel.</label>
        <div class="controls">
            <input type="text" class="input-xlarge">
        </div>
    </div>
<!-- END Elements to clone -->    
</div>

Answer 1

您的输入名称应全部为name[]而不是name_1，name_2等.PHP识别此名称格式，并使$_POST['name']成为一个数组，其元素为具有该名称的每个输入。

您仍需要为元素提供唯一ID。但也许你的克隆输入根本不需要ID，所以你可以完全避免这个问题。

您可能还想查看jquery-dynamic-form插件。但是，我刚刚检查过它并没有解决这个问题（实际上，每行中嵌入了+和 - 按钮的演示都有重复的ID，所以它不是一个有效的DOM）。

顺便说一句，您不需要使用new Number。只需写下：

var newNum = num+1;

Answer 2

要创建唯一ID，只需保留一个从0开始的计数器，并在每次进行新克隆时递增1。然后将此计数器连接到您的名称字段。

jquery克隆新元素并将变量添加到name

2 个答案: