Il metodo clone() di jQuery ci permette di clonare un elemento e, facoltativamente, anche gli eventi ad esso associati. Ma se dovessimo clonare lo stesso elemento più volte dovremmo effettuare diverse chiamate a questo metodo. Vediamo come ovviare al problema.
Possiamo creare un plugin che cloni un elemento n-volte:
(function($) {
$.fn.duplicate = function(count, cloneEvents) {
var tmp = [];
for ( var i = 0; i < count; i++ ) {
$.merge( tmp, this.clone( cloneEvents ).get() );
}
return this.pushStack( tmp );
};
})(jQuery);
Il plugin accetta come opzioni il numero di copie da restituire e un flag booleano per clonare o meno anche gli eventi. Esempio pratico:
$('#duplicate').click(function() {
var copies = $('div.test').duplicate(3, false);
$(copies).appendTo('#target');
return false;
});
Potete visionare l'esempio finale in questa pagina.