[英]How to clone in jquery
I am using this code for cloning. 我正在使用此代码进行克隆。
I want to modify this code when I click on the clone button it's cloning again and again clone and remove button for every new generated dynamic div. 当我单击“ 克隆”按钮时,我想修改此代码,它又为每个新生成的动态div再次克隆并删除按钮。
When I click on the clone button the first time, it clone the same div using same id id =clonedInput1 , after that it start increment. 当我第一次单击克隆按钮时,它将使用相同的id id = clonedInput1克隆相同的div,然后开始递增。
You can find a working version here http://jsfiddle.net/shalucosmic/FEpMk/7/ 您可以在这里找到工作版本http://jsfiddle.net/shalucosmic/FEpMk/7/
<script type="text/javascript">
$(document).ready(function(){
//jQuery(this).parent(".clonedInput")
var regex = /^(.*)(\d)+$/i;
var cloneIndex = $(".clonedInput").length;
$("button.clone").live("click", function(){
$(this).parents(".clonedInput").clone().appendTo("body").attr("id", "clonedInput" + cloneIndex)
.find("*").each(function() {
var id = this.id || "";
var name = this.name || "";
var match = id.match(regex) || [];
var matchname = name.match(regex) || [];
if (match.length == 3) {
this.id = match[1] + (cloneIndex);
}
if (matchname.length == 3) {
this.name = match[1] + (cloneIndex);
}
});
cloneIndex++;
});
$("button.remove").live("click", function(){
$(this).parents(".clonedInput").remove();
});
});
<div id="clonedInput1" class="clonedInput">
<input type="text" name="contributer1" value="" id="contributer1"/>
<div class="actions">
<button class="clone">Clone</button>
<button class="remove">Remove</button>
</div>
</div>
You can simplify it as 您可以将其简化为
$(document).ready(function() {
// jQuery(this).parent(".clonedInput")
var regex = /^(.*)(\d)+$/i;
var cloneIndex = $(".clonedInput").length + 1;
$(document).on("click", 'button.clone', function() {
$(this).closest(".clonedInput").clone().appendTo("body").attr("id",
"clonedInput" + cloneIndex).find("[id], [name]").each(
function() {
this.id = this.id.replace(/\d+$/, cloneIndex);
this.name = this.name.replace(/\d+$/, cloneIndex);
});
cloneIndex++;
});
$("button.remove").live("click", function() {
$(this).parents(".clonedInput").remove();
});
});
you need to add 1 in cloned input length 您需要在克隆的输入长度中添加1
var cloneIndex = $(".clonedInput").length + 1;
// -----^^^^ here
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.