jquery Dynamicaly克隆字段和增量id

如何克隆此块并增加标题号，如果可能的话增加ID？

对于每个div“block-1”我想要添加和删除选项。 提前致谢

 
 
 
title 1
 First Name* Last Name* Middle Initial* Social Security #* 
 Foreign Address* 
 Yes   
 
 No  
 
 Address line 1* Address line 2* City * Email * Date of Birth * Home Phone* Gender * 
 
  

Answer 1

我在这里的示例中为您的标记添加了几个按钮： http ： //jsfiddle.net/w4efg/然后它只是：

 $('.addme').click(function(ev) { var aim = $(this); var ap = aim.parent(); var newbk = ap.clone(true); var apindex = $('[class^=block-]').index(ap); var bkId = 'block-' + (apindex + 1); newbk.addClass('block-' + (apindex + 2)).removeClass(bkId); ap.after(newbk); }); $('.removeme').click(function(){ $(this).parent().remove(); }); 

注意我的CSS中的类只是为了显示它在前三个上工作。

我的例子有点冗长，如果你想把它缩小一点，就可以清楚地显示它的作用。 它还允许删除第一个块，这可能是坏的:)。 并且索引的逻辑只是添加了一个新数字，因此block-xx将xx作为您单击的块之后的索引，可能会更好。

编辑：我添加了“标题”的东西（可能想要h4上的标题类）并拿出一些代码，如本更新中所述： http ： //jsfiddle.net/w4efg/1/

Answer 2

如果您正在使用jQuery javascript Framework，您可以执行以下操作…

建立一个function……

 var clone_block = function($block) { block_num = Number($block.attr('class').substr(6))+1 // <-- Add one to block number $cloned = $block.clone() $cloned.children('.fieldset-emp h4:first').html('title '+block_num) $cloned.attr('class','block-'+block_num) return $cloned } 

...这将使您能够执行此类操作，其中#id_of_your_block_container是包含所有块的元素的选择器...

 clone_block($('.block-1')).appendTo($('#id_of_your_block_container')) 

就像旁注一样，最好让所有“块”

都有一个"block" class并且具有唯一的id ，例如