0

我正在尝试克隆一个表单并将表单名称从(例如)#form 和当克隆到 #form1 并在输入上执行相同的操作时,我真的被困在如何做到这一点上!任何帮助都将不胜感激,因为我花了一整天的时间试图弄清楚。这是我的代码:

HTML:

<div class="avail">
<form action="submit.php" id="form1" method="post">
<input type="text" name="input1" />
<input type="text" name="anotherinput1" />
<input type="text" name="onemoreinput1" />
<input type="submit" name="submit1" value="submit" />
</form>
</div>

 <input type="submit" value="+" id="copy" />

JQUERY(用于克隆 div 和表单):

$("#copy").click(function(e) {
       $(".avail").clone().removeAttr('id').insertBefore(this);
       e.preventDefault();
    });

请如果有人知道如何做到这一点,我将非常感激!

4

2 回答 2

2

您可以只计算您有多少可用对象并将其用作新表单 ID 的运行计数。

$("#copy").click(function(e) {
   var avails = $(".avail");
   var cnt = avails.length + 1;
   avails.eq(0).clone().insertBefore(this).find("form").attr("id", "form" + cnt);
   e.preventDefault();
});

你可以在这里看到它的工作原理:http: //jsfiddle.net/jfriend00/9CU85/

如果您还需要更新元素name属性上的数字input,那么您也可以使用此代码来执行此操作:

$("#copy").click(function(e) {
   var avails = $(".avail");
   var cnt = avails.length + 1;
   avails.eq(0).clone().insertBefore(this)
       .find("form").attr("id", "form" + cnt)
       .find("input").each(function() {
           this.name = this.name.replace(/\d+/, cnt);
       });
   e.preventDefault();
});​

你可以在这里看到这项工作:http: //jsfiddle.net/jfriend00/SKjMN/

于 2012-04-06T03:02:41.900 回答
0
$('#copy').click(function(e){
    var formNode = $('.avail form')[0];
    var idAttibute = $(formNode).attr('id');
    var id = id.charAt(idAttibute.length-1);

    var copy = $(".avail").clone().removeAttr('id');
    $(copy).find('form').attr('id', 'form' + id);
    $(copy).insertBefore(this);

});
于 2012-04-06T00:37:57.733 回答