克隆的元素，避免在同一时间超过一个克隆加入

Question

http://jsfiddle.net/p57hm/

时，我只是想每次点击一个更多的克隆。我错过了什么obvious_感谢

脚本：

$(function(){ 

    $('input').click(function(){ 
     $('.cloneitem').clone().appendTo('#container'); 
    }); 

}); 

HTML：

<input type="button" value="clone it"/> 

<div id="container"></div> 

<div class="cloneitem">clone</div> 

Answer 1

试试这个http://jsfiddle.net/p57hm/1/

$(function(){ 

    $('input').click(function(){ 
     $('.cloneitem:first').clone().appendTo('#container'); 
    }); 

}); 

目前您正克隆所有具有类元素.cloneitem但你一次只需要1个，所以你不想全选e .cloneItem但只是第一个，并克隆那一个。

Answer 2

您的克隆仍具有类cloneitem，因此正在被克隆。 删除此类或更改选择器，使其不包含它们。

像这样，加入类克隆，并过滤掉这些项目：

$(function(){ 
    $('input').click(function(){ 
     $('.cloneitem').not('.cloned').clone().addClass('cloned').appendTo('#container'); 
    });  
}); 

http://jsfiddle.net/infernalbadger/p57hm/4/

Answer 3

$(function(){ 
    var clone = $('.cloneitem').clone(); 
    $('input').click(function(){ 
     clone.clone().appendTo('#container'); 
    }); 
}); 

http://jsfiddle.net/tZuDe/

Answer 4

$('.cloneitem')选择与cloneitem类的所有元素。

使用.first()：

$('input').click(function(){ 
    $('.cloneitem').first().clone().appendTo('#container'); 
}); 

Answer 5

你是克隆的所有元素以“cloneitem”类，所以在第一次克隆一次，第二次将其克隆2 .. U可以修复它通过过滤只有第一个对象是这样的：

$(function(){ 

    $('input').click(function(){ 
     $('.cloneitem').first().clone().appendTo('#container'); 
    }); 

}); 

您也可以随时选择最后一个：

$('.cloneitem').last().clone().appendTo('#container'); 

或者只是绑定.clone（）的第一个项目：

$('.cloneitem:first').clone().appendTo('#container'); 

Answer 6

你克隆一个元素与类“cloneitem”随后还追加与同一类问题引起的下一个克隆的克隆元素。

$(function() { 

    $('input').click(function(){ 
     $('.cloneitem').first().clone().removeClass('cloneItem').appendTo('#container'); 
    }); // edited 

}); 

Answer 7

有同样的问题。向想要克隆的div添加一个id，这种方式是唯一的。一个元素只能有一个id，但有很多类。